title: How to hide div that is referenced by an anchor href on click with javascript (jQuery)
body: <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>