Using jQuery to change background color on click
<p>I am new to jQuery and I have read through threads on this topic, but I am having some trouble understanding the logic and after re-writing my code, I'm still unable to get it to work. </p>

<p>I have two buttons and I would like for each one to change the background color and text color on click. Here is a link to my <strong><a href="https://jsfiddle.net/allisoncodes/zdpbx518/" rel="nofollow">jsfiddle</a></strong></p>

<p>Any feedback or advice would be very appreciated. Thanks!</p>

<pre><code>jQuery(document).ready(function() {
    $("#footer").on("click", "#purple', function() {
       $(this).css("background-color", "#9683ec");
       $(this).css("color", "#2d2746");
    });

    $("footer").on("click", "#blue', function() {
       $(this).css("background-color", "#00bfff");
       $(this).css("color", "#002633");
    });
});
</code></pre>