Javascript Click function not working?

Question

I am trying to make my new website more interactive so have decided to lift some javascript from my old website which used to make the body background in CSS change color when a button is pressed. Now i have added all the code into my new website it just doesn't work at all, I have no idea why,

Here is my HTML

<input id="bodycolorgreen" type="button" value="Green">

Here is my Javascript

$(document).ready(function () {

  $("#bodycolorgreen").click(function () {
    $("body").css("background-color", "green");
  });
});

, Currently my CSS code for body is;

body {
  background-color:black;
}

Basically all I am trying to do is when the button named "bodycolorgreen" is pressed I want it to change the page background to green.

Here is my Linking pages just in case I have lined them wrong.

<link rel="stylesheet" href="stylesheet.css" type="text/css">
<script type="text/javascript"  src="javascript.js"></script>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.8.0.min.js"></script>

Answer 1

Since your script file is using jQuery, it has to be included first

<script type="text/javascript" src="http://code.jquery.com/jquery-1.8.0.min.js"></script>
<script type="text/javascript"  src="javascript.js"></script>