title: jQuery multiple divs show hide only one at a time
body: <p>Hello and let me first explain that I have not used jQuery very much at all.  Simple show and hide and basic UI is the extent.  So with that said, I am trying to be able to show a div, that is actually a "page" that has been linked to a "link".  </p>
  
  <p>Markup:</p>
  
  <pre><code>&lt;body&gt;
  &lt;!--Footer and Navigation Div's--&gt;
  &lt;div id="bg"&gt;&lt;img src="images/bg.jpg" alt=""&gt;&lt;/div&gt;
      &lt;div id="footer"&gt;
          &lt;p&gt;S.E. &lt;span&gt;yoga&lt;/span&gt;&lt;/p&gt;
              &lt;div id="nav"&gt;
                  &lt;ul&gt;&lt;a href="#"&gt;Link 1&lt;/a&gt;&lt;/ul&gt;
                  &lt;ul&gt;&lt;a href="#"&gt;Link 2&lt;/a&gt;&lt;/ul&gt;
                  &lt;ul&gt;&lt;a href="#"&gt;Link 3&lt;/a&gt;&lt;/ul&gt;
                  &lt;ul&gt;&lt;a href="#"&gt;Link 4&lt;/a&gt;&lt;/ul&gt;
              &lt;/div&gt;
      &lt;/div&gt;
  &lt;!--END Footer and Navigation Div's--&gt;
  
  &lt;div class="parent"&gt;
  &lt;div class="a"&gt;
          &lt;p&gt;this is a&lt;/p&gt;
      &lt;/div&gt;   
     &lt;div class="b"&gt;
          &lt;p&gt;this is b&lt;/p&gt;
      &lt;/div&gt;
      &lt;div class="c"&gt;
          &lt;p&gt;this is c&lt;/p&gt;
      &lt;/div&gt;
      &lt;div class="d"&gt;
          &lt;p&gt;this is d&lt;/p&gt;
      &lt;/div&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>jQuery:</p>
  
  <pre><code> /*
   $(document).ready(function(){
   $('#nav').click(function(){
          $(".a").slideToggle();
    var divname= this.value;
            $("#"+divname).show("slow").siblings().hide("slow");
  
      });
  });*/ 
  
      $(document).ready(function(){
      $('.a, .b, .c, .d').hide();
  });;
  </code></pre>
  
  <p>So the first script (commented out) I was using I was going to use as a starting point.  The second script, where they are all hidden is where I was going to go from.  Hide them all, then show only one at a time.  </p>
  
  <p>The divs are overlapping.  Any help?  Thanks!</p>