jquery will not work for me!
<p>It's weird! I was working on my CSS and jquery just stopped working! checked in firefox/chrome and the jquery just stopped working!  I have no idea what happen. </p>

<p>I have 2 functions going on. First part animates the header image and the second part generates random numbers when it is click. I pasted my whole code at pastebin.</p>

<pre><code>&lt;!DOCTYPE html&gt;
&lt;html lang="en"&gt;
&lt;head&gt;
  &lt;title&gt; Hello &lt;/title&gt;
  &lt;meta charset="UTF-8"&gt;
  &lt;link rel="stylesheet" href="css/reset.css"&gt;
  &lt;link rel="stylesheet" href="css/default.css"&gt;

  &lt;!--[if lt IE 9]&gt;
    &lt;script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"&gt;&lt;/script&gt;
  &lt;![endif]--&gt;

  &lt;script src="js/jquery.js"&gt;&lt;/script&gt;
&lt;/head&gt;
&lt;body&gt;
  &lt;!-- #header Image --&gt;
  &lt;img id="header" src="images/header.png" width="424" height="63" alt="Header"&gt;
  &lt;!-- /#header Image --&gt;
  &lt;div id="main-wrapper"&gt;
    &lt;h1&gt; Your points will be genarated below &lt;/h1&gt;

    &lt;form&gt;
      &lt;input id="points" type="text"/&gt;
      &lt;input type="button" id="generate" value="Generate Points!" /&gt;
    &lt;/form&gt;

  &lt;/div&gt;&lt;!-- /#main-wrapper --&gt;
  &lt;!-- Generate --&gt;
  &lt;script src="js/gen.js" type="text/javascript" charset="utf-8"&gt;&lt;/script&gt;

&lt;/body&gt;

$(document).ready(function(){
      // Makes the image go under the div wrapper.
     $('img#header').css({'position' : 'relative', 'top' : '17px', 'z-index' : '50' })
    //create the animation
     $('img#header').hover(function()
  {
    $(this).filter(':not(:animated)').animate({"top": "-3px" }, "slow");
      }, function() {
    $(this).stop().animate({"top": "17px"}, "slow");
  });



  // Generate Numbers 
    $("#generate").click(function(){
      var code = "";
      var alphabet = new Array('A', 'B', 'C', 
               'D', 'E', 'F', 
               'G', 'H', 'I', 
               'J', 'K', 'L', 
                 'M', 'N', 'O', 
                 'P', 'Q', 'R', 
               'S', 'T', 'U', 
               'U', 'V', 'W', 
                 'X', 'Y', 'Z');
        var count = 5 * 4;
        for (var i=0; i&lt;count; i++){
          var number = false;
          var type = Math.round(Math.random() * 2);
          if (type == 0) number = true; else number = false;
            var output;
            if (number){
              code += String(Math.floor(Math.random() * 10));
          }
            else
          {
            var ranChar = Math.floor(Math.random() * alphabet.length)
            code += alphabet[ranChar];
          }
          if (((i+1) % 5 == 0) &amp;&amp; i != count-1) code += "-";
        }
          $("#points").val(code);
      });
    });


body { background: #0d0d0d url(../images/body-bg.jpg) repeat; width: 500px; margin: 154px auto; } 
img#header { padding: 0 41px; }

div#main-wrapper { background: #dfdfdf; border-radius: 10px; -moz-border-radius: 10px; -webkit-border-radius: 10px; position: relative; z-index: 1000; padding:                       44px  64px; -webkit-box-shadow: 0 0 10px #000; -moz-box-shadow: 0 0 10px #000; box-shadow: 0 0 10px #000;  }

div#main-wrapper h1 { color: #0d0d0d; font: italic bold 1.2em Georgia, Arial, Serif; text-align: center; text-shadow: -1px 1px 0 #fff; margin-bottom: 38px; }

/* Form Generator */
form {}
form input[type="text"]#points { background: #d6d6d6; border: 1px #909090 solid; display: block; font: bold 1.3em Arial, Serif; margin: 0 auto; padding: 10px;  }
form input[type="button"]#generate { background: #2d69bd; background: -webkit-gradient(linear, 0% 0%, 0% 71%, from(#3171CA), to(#15396F)); background: -moz-linear-gradient(21% 74% 90deg,#15396F, #3171CA); border: 1px #5b93d1 solid; border-radius: 16px; -webkit-border-radius: 16px; -moz-border-radius: 16px; padding: 10px; }
</code></pre>

<p>The css and jquery was working, then for some reason it stopped working.</p>
