jquery make div appear when clicked href clicked on
<pre><code>#tabs-1 {
    display: none;
}    

#tabs-2 {
    display: none;
}

#tabs-3 {
    display: none;
}

&lt;script type="text/javascript"&gt;    
      $(document).ready(function () {
          $(this).click(function () {    
              var a = $(this).find("a").attr("href"); 
              $(a).show();
          });
      }); 
&lt;/script&gt;

&lt;body&gt;
&lt;form id="form1" runat="server"&gt;
  &lt;div class="tabs"&gt;
    &lt;ul&gt;
      &lt;li&gt;&lt;a href="#tabs-1"&gt;Nunc tincidunt&lt;/a&gt;&lt;/li&gt;
      &lt;li&gt;&lt;a href="#tabs-2"&gt;Proin dolor&lt;/a&gt;&lt;/li&gt;            
    &lt;/ul&gt;
    &lt;div id="tabs-1"&gt;
        &lt;h2&gt;Content heading 1&lt;/h2&gt;
        &lt;p&gt;Proin elit arcu, rutrum commodo, vehicula tempus, commodo a, risus. Curabitur nec arcu. Doin. Sed ut dolor nec orci tincidunt interdum. Phasellus ipsum. Nunc tristique tempus lectus.&lt;/p&gt;
    &lt;/div&gt;
    &lt;div id="tabs-2"&gt;
      &lt;h2&gt;Content heading 2&lt;/h2&gt;
      &lt;p&gt;Morbi tfhgdfahsdh&lt;/p&gt;
    &lt;/div&gt;
  &lt;/div&gt;    
&lt;/form&gt;
&lt;/body&gt;
</code></pre>

<p>I'm trying to make a simple jquery script that makes these divs appear when i click on the ahref in the ordered list. When i run this code it always displays the first element in the ordered list. I want to display the element that is linked in the hyperlink.  </p>
