title: Show hide DIVs : jQuery
body: <p>I have two links &amp; I want to show / hide them one at a time, my code is :</p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html&gt;
  &lt;head&gt;
  &lt;script class="jsbin" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"&gt;&lt;/script&gt;
   &lt;script type="text/javascript" src="js/jquery.js"&gt;&lt;/script&gt;          
   &lt;script type="text/javascript"&gt;                                         
     // we will add our javascript code here    
     $(document).ready(function() {
         $(function(){
             $('#link').click(function(){
             $('#colorDiv').slideToggle('slow');
              return false;
            });
          });
   });
   &lt;/script&gt;
  &lt;meta charset=utf-8 /&gt;
  &lt;title&gt;JS Bin&lt;/title&gt;
  &lt;!--[if IE]&gt;
    &lt;script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"&gt;&lt;/script&gt;
  &lt;![endif]--&gt;
  &lt;style&gt;
   #dv {
    width:100px;
    height:100px;
    border:1px solid;
  }
  &lt;/style&gt;
  &lt;/head&gt;
  &lt;body&gt;
  &lt;table cellspacing="2"&gt;
      &lt;tr&gt;&lt;td&gt;&lt;a href="#" id="link"&gt;Color&lt;/a&gt;&lt;/td&gt;&lt;td&gt;&lt;a href="#" id="link"&gt;Car&lt;/a&gt;&lt;/td&gt;&lt;/tr&gt;
      &lt;tr&gt;&lt;td&gt;&lt;div id="colorDiv"&gt;Red&lt;/div&gt;&lt;/td&gt;&lt;td&gt;&lt;div id="carDiv"&gt;PRADO&lt;/div&gt;&lt;/td&gt;&lt;/tr&gt;
  &lt;/table&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>by default first div should me shown.
  hanks. </p>