Question

I’m trying to make a div change it’s content with the clicked image.

I’ve tried this:

$(document).ready(function(){

   $('.smallImg').click(function(){
       $('.bigImg').html(this);
   });

});//

<div class='smallImg'><img src='imgHere'></div>
<div class='bigImg'></div>

It’s working, but for some reason, it’s removing the clicked image. Why, and how would I make it not to?

Answer 1

It’s removed because the dom node is moved. You can prevent that by cloning the dom-node:

$(document).ready(function(){

   $('.smallImg').click(function(){
       $('.bigImg').html($(this).clone());
   });

});//