Jquery Fade not working
<p>I am using this jquery to show a div on top of another one when it is hovered over, but for some reason even though it seems to work the fadeIN and fadeOUT don't work.</p>

<p>if I change the fadeTo to <code>fadeIn</code> and <code>fadeOut</code> respectively then that breaks it as the previous one you hover over dosen't disappear?</p>

<pre><code>$(function() {
$(".report-hover").hover(
    function() {
        $(this).children("img").fadeTo(200, 0.85).end().children(".report-image-hover").show();
    },
    function() {
        $(this).children("img").fadeTo(200, 1).end().children(".report-image-hover").hide();
    });
});
</code></pre>

<p>Markup:</p>

<pre><code>&lt;div class="report-hover"&gt;

                &lt;div class="report-image-hover"&gt;
                &lt;a href="#"&gt;
                &lt;img src="&lt;?php bloginfo('template_url'); ?&gt;/images/.....png" alt="Report" /&gt;
                &lt;/a&gt;
                &lt;/div&gt;

                &lt;img src="&lt;?php bloginfo('template_url'); ?&gt;/images/.....png" alt="Report" /&gt;
&lt;/div&gt;
</code></pre>
