title: jQuery problem: hover, un-hover not working
body: <p>Im having a problem. 
  This is my website <a href="http://keironlowe.x10hosting.com/" rel="nofollow noreferrer">http://keironlowe.x10hosting.com/</a>
  The red lines that move in the navigation bar is due to this code below.
  But its not working as intended.
  What I want is is is for the red lines to get longer on hover.
  But go back to normal size when you move the cursor away, 
  but thats not working properly, it only works once and then you have to refresh, and it doesnt work on the home link and It gets smaller instead of longer. Help?</p>
  
  <pre><code>&lt;script type="text/javascript" src="jQuery.js"&gt;&lt;/script&gt;
  &lt;script type="text/javascript"&gt;
  $(document).ready(function() {
   $('div', '#nav_container').hover(function() {
      $(this).animate({width: '220px'}, 1000);      
  }, function() {
      $(this).animate({width: '300px'}, 1000); 
  });
  });
  &lt;/script&gt;
  </code></pre>