JSFiddle - React, Tailwind, and code Playground

HTML

<div id="container" style="width:400px; height:500px; background-color:yellow;">
    <div class='holder' style="position:absolute;top:0;left:0;"><img class="cat" 
        src="http://jsfiddle.net/img/logo.png" 
        style="background-color:blue;" />
    </div>
</div>

JavaScript

var contW = $('#container').width();
var contH = $('#container').height();
var explode;

$('.holder').click(explode=function() {    
    for (var j = 1; j <= 3; j++){        
       var sourceX = (Math.random()*contW)%(contW>>1);
       var sourceY = (Math.random()*contH)%(contH>>1);
       var nTop = Math.floor((Math.random()*contW)%contW);
       var nLeft = Math.floor(((Math.random()*contH)%contH));
       var $child = $(this).clone();       

       $('#container').append($child);
       $child.css({ top:sourceX, left: sourceY })
           .animate({ top: nTop+'px', left:nLeft+'px' }, 200)
           .click(explode);
    }

    $(this).hide();
});