title: Showing/ hiding a div when click on a link
body: <p>I am trying to show and hide a div when clicking a link. I got the div to show correctly, but I want that div to go away when I click a different one. This is the code I currently have. </p>
  
  <pre><code>&lt;script type="text/javascript"&gt; 
              $(function() {
                  $('#attach_silver').click(function() {
                      $('#sec_silver').show();
                      return false;
                  });        
              });
  
              $(function() {
                  $('#attach_gold').click(function() {
                      $('#sec_gold').show();
                      return false;
                  });        
              });
  
              $(function() {
                  $('#attach_platinum').click(function() {
                      $('#sec_platinum').show();
                      return false;
                  });        
              });
          &lt;/script&gt;
  
  &lt;a href="#" id="attach_silver"&gt;Silver&lt;/a&gt;
      &lt;a href="#" id="attach_gold"&gt;Gold&lt;/a&gt;
      &lt;a href="#" id="attach_platinum"&gt;Platinum&lt;/a&gt;
  
  &lt;div id="sec_silver" style="display: none;"&gt;
          Hello world!! Silver              
      &lt;/div&gt;
  
      &lt;div id="sec_gold" style="display: none;"&gt;
          Hello world!! Gold             
      &lt;/div&gt;
  
      &lt;div id="sec_platinum" style="display: none;"&gt;
          Hello world!! Platinum            
      &lt;/div&gt;
  </code></pre>