title: jquery sortable - allow only last item dropped in target li
body: <p>I have list of numbers, and two destination blocks. I would like to drop number to target block, but keep only last dropped item. </p>
  
  <p>Here is the sample jsfiddle - <a href="http://jsfiddle.net/jpatel/R2bFu/1/" rel="nofollow">demo - which allows only one item drag</a></p>
  
  <p>Code -</p>
  
  <pre><code>$(function() {
      $("ul.droptrue").sortable({
          connectWith: "ul",
      });
  
      $("ul.dropfalse").sortable({
          connectWith: "ul",
          dropOnEmpty: false
      });
  
      $("#sortable1, #sortable2, #sortable3").disableSelection();
  
      $("#sortable3,#sortable4").on("sortreceive", function(event, ui) {
          var $list = $(this);
  
          if ($list.children().length &gt; 1) {
              $(ui.sender).sortable('cancel');
  
              //Move the existing one back to sortable1
              //Only keep the last moved element
          }
      });
  });
  </code></pre>
  
  <p>In above example if user try to drag 2nd number to sortable3 or 4, it doesn't allow another number. The behavior I am expecting is if new number is dragged, the previous one should go back to sortable1 list (back to origin).</p>
  
  <p>Thanks.</p>