jQuery swapped image not loading
<p>I'm trying to get an image to swap on the click event of a div class using jQuery .attr from the original image source location of "Images/origImage" to a new image source location of "Images/newImage"</p>

<p>When I click in the div the image Url property does change if right click on image and view the Address (URL) property I see the new image URL I but in the browser the image does not load - I see the white box with the red cross. My jQuery code is in a ASP.NET Master page and the div and image markup is in the content page.</p>

<p>Here is the content page markup</p>

<pre><code> &lt;div class="xxx"&gt;
   &lt;img src="Images/origImage" class="changesrc" /&gt;
 &lt;/div&gt;
</code></pre>

<p>And in the master page head I have:</p>

<pre><code>&lt;script language="javascript" type="text/javascript"&gt;
    $("div.xxx").click(function(){  
      $('.changesrc').attr("src", "Images/newImage");
    });
&lt;/script&gt;
</code></pre>

<p>Could anyone help me on how to achieve swapping the image and getting it to load in the browser. I tried preloading the new image but that did not seem to work.</p>
