title: Jquery change background color
body: <p>I was  trying out jquery with this example:</p>
  
  <pre><code> $(document).ready(function(){
        $("button").mouseover(function(){
          $("p#44.test").css("background-color","yellow");
          $("p#44.test").hide(1500);
          $("p#44.test").show(1500);
          $("p#44.test").css("background-color","red");
        });
      });
  </code></pre>
  
  <p>I expected the following to happen:</p>
  
  <pre><code>1. Color of &lt;p&gt; to turn yellow
  2. &lt;p&gt; to slowly fade
  3. &lt;p&gt; to slowly show
  4. Color of &lt;p&gt; to turn red
  </code></pre>
  
  <p>But this is what actually happened:</p>
  
  <pre><code>1. &lt;p&gt; turned red
  2. &lt;p&gt; slowly hid away
  3. &lt;p&gt; slowly showed
  </code></pre>
  
  <p>Why is that?</p>