Why is my JavaScript code refusing to run on my website? : <p>The following is what my HTML document looks like:</p>

<pre><code>&lt;!DOCTYPE html&gt;
&lt;html&gt;
&lt;head&gt;
    &lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"&gt;&lt;/script&gt;
    &lt;script src="scripts/homepage-script.js"&gt;&lt;/script&gt;
&lt;/head&gt;

&lt;body&gt;
&lt;div id="how-it-works"&gt;
    &lt;p&gt;How It Works&lt;/p&gt;
    &lt;img src="some-imageurl"&gt;
    &lt;div id="steps"&gt;
    &lt;p&gt;Step 1&lt;/p&gt;
    &lt;p&gt;Step 2&lt;/p&gt;
    &lt;p&gt;Step 3&lt;/p&gt;
&lt;/div&gt;
</code></pre>

<p></p>

<p>And here is my script:</p>

<pre><code>$('#steps &gt; p').on('click' , function(){
    $('steps &gt; p').css('background', 'yellow');
});​
</code></pre>

<p>Why is my script not running on my website?</p>
