JQuery: Dynamic image replace on hover?
<p>I want a Jquery function that takes a img element, and when it is hovered, it replaces the img like this: myimage.png replaces to myimage2.png</p>

<p>This is what I came up with but it's not working:</p>

<pre><code>        $("#menu img").hover(function(){
        var split = $(this).attr("src").split(".png");
        $(this).attr("src", split[0]+"2.png");
    }, function(){
        var split = $(this).attr("src").split(".png");
        $(this).attr("src", split[0]+".png");
    });
</code></pre>

<p>I'm sure the veterans can come up with a much better approach, so please.</p>
