Using fadeout, fadein in JQuery with img
<p>Im new to jQuery, and what im trying to accomplish is I want a image to fade in and out, and after its finished fading out, I want to change the image the image while fading in the new src. is not exactly working the way I want it to. Here is what I have so far. Any help would be very helpful.</p>

<pre><code>&lt;img src="images/airport1.jpg" Height="200" Width="500" id="main_pic"/&gt; 
&lt;input id="Button1" type="button" value="button" /&gt;

&lt;script&gt;
$(document).ready(function () {
    $("#Button1").click(function () {
        changePicture();
    });
});
function changePicture() {
    $("#main_pic").fadeOut(5000).delay(3500).attr('src', "images/airport2.jpg").fadeIn(5000);
}
&lt;/script&gt;
</code></pre>
