title: Javascript works in Firefox and IE, but not Chrome
body: <p>I had a web page that I thought had way too much content showing at one time, so I wrote some JavaScript to hide a bunch of images until they were needed.  At the bottom of said page I have a link that says, "Click here for Screen Shots!" When clicked the JS will display a previously hidden span that contains all the screenshots.  The link text is changed to, "Click here to hide Screen shots." This works in IE and Firefox, but for some reason not in Chrome (in chrome I have to click the hide link 3 times before the span is hidden again).  The code is fairly simple, but I cant figure out what is wrong with it.  Any ideas?</p>
  
  <p>The JS:</p>
  
  <pre><code>$('#show').click(function(){
  $('#Screenies').show('slow');
  $('#show').hide();
  $('#hide').show();
  });
  
  $('#hide').click(function(){
  $('#Screenies').hide('slow');
  $('#hide').hide();
  $('#show').show();
  });
  </code></pre>
  
  <p>The Html:</p>
  
  <pre><code> &lt;p id="show" style="cursor:pointer; color:Navy"&gt;&lt;u&gt;Click here for sceenshots!&lt;/u&gt;&lt;/p&gt;
   &lt;p id="hide" style="cursor:pointer; color:Navy"&gt;&lt;u&gt;Hide sceenshots&lt;/u&gt;&lt;/p&gt;
   &lt;span id="Screenies"&gt;
        [Image links in here]
   &lt;/span&gt;
  </code></pre>
  
  <p>Edit:
  Forgot to mention I am using Jquery 1.6</p>