I need some help with the clone function using drag and drop.  I am very new to jquery, so I'm sure I am just making a rookie mistake here, but any help would be appreciated.

My application needs to be able to drag images from one div and drop them to another div that is the "droppable" area.  These images once dropped must still have the ability to be draggable within the droppable area.  I am also capturing the text from the image and saving it to a database.

I have read many posts describing how to do this, but the only way I have been able to achieve the functionality I am looking for is to use the .append() call in my string.  This allows my code to work and successfully save the data to the database, but I do not want to move the image from the original location...I just want to copy (or clone) it.  If I just change the call "append" to "clone", I lose anything listed after that line in the code.

Here is the code how it is now.  I am looking for someone to direct me how to change the append to clone but maintain the rest of the functionality.

    function init(){

      var dragtext;
      var count = 0;
    
      //make all drag me elements draggable
      $(".dragMe").draggable({
          cursor: 'move',
          helper: function (e,ui) {
          return $(this).clone().appendTo('body').show();},
            distance: '20'
        });

//set target as droppable
      $("#target").droppable({
          accept: '.dragMe',
          tolerance: 'touch',

          drop: function(event, ui){
            var imageinfo;
            dragtext = ui.draggable.text();
            var clonedpic = (ui.draggable);
           $("#target").append(clonedpic);    //This is the line of code in question!!!!!
            clonedpic.css('position', 'absolute');
            clonedpic.draggable('destroy').draggable(); /* need to reset the draggability */

There is more code after this, but hopefully this is enough to fix the clone problem