How to hide div that is referenced by an anchor href on click with javascript (jQuery)
<p>I have several blocks of text separated into their own divs. I also have several links in a navigation bar that reference these divs with an anchor link. On click, I'd like to hide all other divs except the one referenced by the clicked link. I have:</p>

<pre><code>&lt;div id="navbar"&gt;
  &lt;ul&gt;
   &lt;li&gt;&lt;a href="#section1"&gt;Link 1&lt;/a&gt;&lt;/li&gt;
   &lt;li&gt;&lt;a href="#section2"&gt;Link 2&lt;/a&gt;&lt;/li&gt;
   &lt;li&gt;&lt;a href="#section3"&gt;Link 3&lt;/a&gt;&lt;/li&gt;
   &lt;li&gt;&lt;a href="#section4"&gt;Link 4&lt;/a&gt;&lt;/li&gt;  
  &lt;/ul&gt;
&lt;/div&gt;
</code></pre>

<p>So, when I click 'Link 3'. I'd like to hide all divs except #section3.</p>

<p>I'm fine actually hiding/showing each section of text using CSS, but I can't figure out how to use the link's href attribute to reference the div name. </p>

<p>Thanks for your help, and let me know if you need clarification of what I'm asking.</p>
