JQuery - page changement de couleur de fond, cliquez sur le bouton

Je suis très nouveau pour jquery et suis en train de changer le fond de page de couleur une fois qu'un bouton est cliqué.

J'ai cherché et il y a pas mal de questions sur des choses similaires, mais je suis à la recherche d'une réponse sur une page d'arrière-plan de changement de couleur en particulier.

J'apprécierais toute aide, merci, Freddie

HTML:

<!DOCTYPE HTML>
<html lang="en">

<head>
    <meta charset="utf-8">
    <link rel="stylesheet" type="text/css" href="style.css">
    <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
    <script type="text/javascript" src="script.js"></script>
</head>

<body>
    <section class="text">
        CLICK THE BUTTON TO<br> CHANGE THE BACKGROUND!
    </section>

    <button id="btn">CLICK ME!</button>

</body>
</html>

CSS:

body {
    height: ;
    background: #D8D8D8;
}

.text {
    color: #686868; 
    font-family: arial;
    font-size: 2em;
    text-align: center;
    margin-top: 50px;
    margin-bottom: 20px;
}

#btn {
    margin-left: 550px;
    width: 200px;
    height: 100px;
    font-size: 2em;
    border-radius: 10px;
    background: #ffffff;
}

#btn:hover {
    background: #ff0000;
    color: #ffffff;
}

JS:

$(button).click(function() {
    $(this).css('background', '#ff0000');
)};
changement $(button) à $('#btn') et envelopper le tout dans un $(document).ready(function() { }); et vous devriez être bon d'aller!

OriginalL'auteur Freddie | 2014-02-10