poblems with jquery code
<p>Another jquery issue...  I have tried this several times using "class" and "id" elements and I can not get it right. I am hoping the brains on stackoverflow can help!  </p>

<p>The problem that I am having is when I open the page all elments are closed.  When I click on one link all links open.  I believe it closes correctly the problem is that when I open the first link all items open.  </p>

<pre><code>&lt;!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0     Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&gt;
&lt;html xmlns="http://www.w3.org/1999/xhtml"&gt;
&lt;head&gt;
&lt;meta http-equiv="Content-Type" content="text/html; charset=utf-8" /&gt;
&lt;title&gt;Bid Items&lt;/title&gt;
&lt;link href="bid.css" rel="stylesheet" type="text/css" /&gt;
&lt;script src="jquerry/js/jquery.js" type="text/javascript"&gt;&lt;/script&gt;

&lt;script type="text/javascript"&gt;


  $(document).ready(function(){ 
  $('#showhideconent').hide(); 
  $('a').click(function(){ 
  $('#showhideconent').show('slow'); 

}); 

 $('a#close').click(function(){ 
        $('#showhideconent').hide('slow'); 
}) 

}); 

 $(document).ready(function(){ 
 $('#showhideconent2').hide(); 
 $('a').click(function(){ 
 $('#showhideconent2').show('slow'); 

}); 

 $('a#close2').click(function(){ 
    $('#showhideconent2').hide('slow'); 
}) 

});  

  $(document).ready(function(){ 
  $('#showhideconent3').hide(); 
  $('a').click(function(){ 
 $('#showhideconent3').show('slow'); 

}); 

 $('a#close3').click(function(){ 
    $('#showhideconent3').hide('slow'); 
}) 

}); 
  $(document).ready(function(){ 
  $('#showhideconent4').hide(); 
  $('a').click(function(){ 
  $('#showhideconent4').show('slow'); 

}); 

 $('a#close4').click(function(){ 
        $('#showhideconent4').hide('slow'); 
}) 

}); 


&lt;/script&gt;

&lt;/head&gt;

&lt;body class="oneColElsCtr" onload="MM_preloadImages('Assignment4b.jpg')"&gt;

&lt;div id="container"&gt;
&lt;div id="mainContent"&gt;

    &lt;h1&gt;Bid Page&lt;/h1&gt;
&lt;h1&gt;Coke Memorbila&lt;/h1&gt;




&lt;a href="#" id="click"&gt;Amber Bottle 1914&lt;/a&gt;
&lt;div id="box" align="center"&gt;
&lt;div id="showhideconent"&gt;
&lt;p&gt;&lt;a href="coke/Amber1914.shtml"&gt;&lt;img src="amber1914.jpg" width="200" height="200"    alt="Amber Coke" /&gt;&lt;/a&gt;&lt;/p&gt;
&lt;p&gt;&lt;a href="#" id="close"&gt;Close&lt;/a&gt; &lt;/p&gt;

&lt;/div&gt;
&lt;/div&gt;


&lt;a href="#" id="click"&gt;Amber Bottle 1915&lt;/a&gt;
&lt;div id="box" align="center"&gt;
&lt;div id="showhideconent2"&gt;
&lt;p&gt;&lt;a href="coke/Amber1915.shtml"&gt;&lt;img src="coke/Amber1914.shtml" width="200" height="200" alt="Amber Bottle 1915" /&gt;&lt;/a&gt;&lt;/p&gt;
&lt;p&gt;&lt;a href="#" id="close2"&gt;Close&lt;/a&gt; &lt;/p&gt;


&lt;/div&gt;
&lt;/div&gt;




&lt;a href="#" id="click"&gt;Green 1929&lt;/a&gt;
&lt;div id="box" align="center"&gt;
&lt;div id="showhideconent3"&gt;
&lt;p&gt;&lt;a href="coke/green1929.shtml"&gt;&lt;img src="green1929.jpg" width="200" height="200" alt="Green 1929" /&gt;&lt;/a&gt;&lt;/p&gt;
&lt;p&gt;&lt;a href="#" id="close3"&gt;Close&lt;/a&gt; &lt;/p&gt;

&lt;/div&gt;
&lt;/div&gt;


&lt;a href="#" id="click"&gt;1970s Cans&lt;/a&gt;
&lt;div id="box" align="center"&gt;
&lt;div id="showhideconent4"&gt;
&lt;p&gt;&lt;a href="coke/tincans.shtml"&gt;&lt;img src="coke_tincan.jpg" width="200" height="200" alt="Tin Cans" /&gt;&lt;/a&gt;&lt;/p&gt;
&lt;p&gt;&lt;a href="#" id="close4"&gt;Close&lt;/a&gt; &lt;/p&gt;


&lt;/div&gt;
&lt;/div&gt;
&lt;/body&gt;
&lt;/html&gt;
</code></pre>
