title: Show/hide form depending on hyperlink clicked
body: <p>I have made 3 different forms and each form contains a div with the same classname as in the other forms. (so they overlap)</p>
  
  <p>I also made a link section with three links to choose which div/form should be shown but i cant get it to work. </p>
  
  <p>I have tried many things but the closest i came was clicking a link and having the div shown for less than a seconds. Please help.</p>
  
  <p>I made a new code, same concept but the original code was probably too long to post here.</p>
  
  <pre><code>&lt;body&gt;
  &lt;div class="links"&gt;
  &lt;table&gt;
  &lt;tr&gt;&lt;td&gt;&lt;a href="" onclick="showdiv('first','second','third')" &gt;first&lt;/a&gt;&lt;/td&gt;&lt;/tr&gt;
  &lt;tr&gt;&lt;td&gt;&lt;a href="" onclick="showdiv('second','first','third')" &gt;second&lt;/a&gt;&lt;/td&gt;&lt;/tr&gt;
  &lt;tr&gt;&lt;td&gt;&lt;a href="" onclick="showdiv('third','second','first')" &gt;Third&lt;/a&gt;&lt;/td&gt;&lt;/tr&gt;
  &lt;/table&gt;
  &lt;/div&gt;
  &lt;form name="first"&gt;
  &lt;div id="first" class="content"&gt;
  -------------
  &lt;/div&gt;
  &lt;/form&gt;
  &lt;form name"second"&gt;
  &lt;div id="second" class="content"&gt;
  //////////////
  &lt;/div&gt;
  &lt;/form&gt;
  &lt;form name="third"&gt;
  &lt;div id=third class="content"&gt;
  ++++++++++++++
  &lt;/form&gt;
   &lt;script type="text/javascript"&gt;
   function hide_all(){
      document.getElementById("first").style.display='none';
      document.getElementById("second").style.display = 'none';
      document.getElementById("third").style.display = 'none';
  }
  hide_all()
      function showdiv(a,b,c) {
      document.getElementById(a).style.display='block';
      document.getElementById(b).style.display = 'none';
      document.getElementById(c).style.display = 'none';      
  }
  &lt;/script&gt;
   &lt;/body&gt;
   &lt;/html&gt;
  </code></pre>
  
  <p>As you can probably see im new to html and javascript :)</p>