 <p>For the fading, you'll need to refrence <a href="http://jqueryui.com" rel="nofollow">jQuery UI</a> in your <code>&lt;head&gt;</code>:</p> <pre><code>&lt;script src="http://ajax.aspnetcdn.com/ajax/jquery.ui/1.8.20/jquery-ui.min.js"&gt; &lt;/script&gt; </code></pre> <p>And then for the rest:</p> <pre><code>// Wait until the document is ready before proceeding $(function(){ // Cache a reference to the banner to jQuery doesn't have to find it again var $banner = $("#banner"); // Immediately add the 'light' class $banner.addClass("light"); // When #change is clicked, swap the classes on #banner $("#change").on("click", function(e){ // Prevent the link from changing the page e.preventDefault(); // Remove 'light', and add 'dark' $banner.addClass("dark", 1000).removeClass("light"); }); });​ </code></pre>