title: Clone draggable after dropping in targeted area with jQuery UI
body: <p>I want some images to drop in a targeted area as many times as possible. But the image drops for only one time. My jQuery UI code:</p>
  
  <pre><code> $(function() {
      $( ".draggable img").draggable({ 
          revert: "invalid",
          appendTo: "#droppable",
          helper: "clone" 
      });
      $( "#droppable" ).droppable({
          activeClass: "ui-state-default",
          hoverClass: "ui-state-hover",
          drop: function( event, ui ) {
             $( this ).find( ".placeholder" ).remove();
             var image = $(".ui-draggable");
             $( "&lt;img /&gt;" ).image.src.appendTo( this );
          }
      });
  });
  </code></pre>
  
  <p>Please see the demonstration here: <a href="https://jsfiddle.net/0n7r8823/2/" rel="nofollow"><strong>jsFiddle example</strong></a> </p>
  
  <p>From the example you see that the image drops in the div area <strong>only the first time</strong>. But I want the user to have the ability to drag and drop the same image <em>as many times as they want</em> in the targeted area. </p>
  
  <p>So for example a user can drag and drop the image 5 times and there will be 5 images <em>cloned</em> in the targeted area. How can I do that?</p>