jquery - onmouseover and onmouseout
<p>I am trying to display/hide a previous/next button when a mouse over/out happens. but it doesn't seem to be working.  Is there anything wrong with my code?</p>

<p>Here is my code.</p>

<pre><code>      &lt;!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&gt;
      &lt;html xmlns="http://www.w3.org/1999/xhtml"&gt;
      &lt;head&gt;
      &lt;meta http-equiv="Content-Type" content="text/html; charset=utf-8" /&gt;
      &lt;title&gt;Portfolio&lt;/title&gt;
      &lt;link rel="stylesheet" href="css/global.css"&gt;

  &lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js"&gt;&lt;/script&gt;
  &lt;script src="js/jquery.easing.1.3.js"&gt;&lt;/script&gt;
  &lt;script src="js/slides.jquery.js"&gt;&lt;/script&gt;
  &lt;script&gt;


       $('.eachImage').on( "mouseover", function() {
         $('#prevButton').show();
       });
        &lt;/script&gt;

      &lt;/head&gt;

      &lt;body bgcolor="#FFFFFF"&gt;

        &lt;div id="container"&gt;
    &lt;div id="example"&gt;
        &lt;div id="slides"&gt;
            &lt;div class="slides_container"&gt;
                &lt;img src="imgs/test.png" width="800" height="456" class="eachImage"&gt;
            &lt;/div&gt;
            &lt;div id="prevButton"&gt;&lt;a href="#" class="prev"&gt;&lt;img src="imgs/arrow-prev.png" width="24" height="43" alt="Arrow Prev"&gt;&lt;/a&gt;&lt;/div&gt;
            &lt;div id="nextButton"&gt;&lt;a href="#" class="next"&gt;&lt;img src="imgs/arrow-next.png" width="24" height="43" alt="Arrow Next"&gt;&lt;/a&gt;&lt;/div&gt;
        &lt;/div&gt;
    &lt;/div&gt;
        &lt;/div&gt;&lt;/body&gt;
      &lt;/html&gt;
</code></pre>

<p>Thanks.</p>
