Dropping to assign the imageurl to the image control the image was dropped on?

Hi Peeps,

I have an image which the end user can drag and I now want to allow them to drop it over several other image controls and populate that image control with the dragged image. Can anyone please help as I am a novice to jQuery!!!

:(:(

Jiggy!

Okay I can now do the above but does anyone know a better solution because I will have to have the drop event for all 16 image controls? Here is my code:-

<script type="text/javascript">
function pageLoad(){
$('#divPreview').draggable({ helper: "clone",
cursor: "move"
});
$('#divCleanTool1').droppable({
drop: function (event, ui) {
var $imagedrop = $('#divCleanTool1').find('img').map(function () {
var $imagedrag = $('#divPreview').find('img').map(function () {
return this.src;
}).get();
this.src = $imagedrag;
});
}
});
};
</script>

Plenty of views but not answers. Must be the only way to do it :(