title: how to remove duplicates from jquery sortable connected lists?
body: <p>This is my code for jquery sortable. I want to remove duplicates from sortable2 and sortable3 after dragging the element within it. I tried so many ways but I failed. Please give me a full working code so that I can implement it on my script.</p>
  
  <pre><code>     &lt;html lang="en"&gt;
       &lt;head&gt;
       &lt;meta charset="utf-8" /&gt;
       &lt;title&gt;jQuery UI Sortable - Connect lists&lt;/title&gt;
       &lt;link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" /&gt;
       &lt;script src="http://code.jquery.com/jquery-1.9.1.js"&gt;&lt;/script&gt;
       &lt;script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"&gt;&lt;/script&gt;
       &lt;link rel="stylesheet" href="/resources/demos/style.css" /&gt;
       &lt;style&gt;
       #sortable1, #sortable2, #sortable3 { list-style-type: none; margin: 0; padding: 0 0 2.5em; float: left; margin-right: 10px; width: 200px; height: 200px; border: solid 1px black; }
       #sortable1 li, #sortable2 li, #sortable3 li { margin: 0 5px 5px 5px; padding: 5px; font-size: 1.2em; width: 120px; }
      &lt;/style&gt;
      &lt;script&gt;
      $(function () {
  
  
        $("#sortable2").sortable({});
  
        $("#sortable3").sortable({});
         $("#sortable1").sortable({ });
        $( "#sortable1 li" ).draggable({
              connectToSortable: "#sortable2,#sortable3",
              helper: "clone",
              revert: "invalid"
          });
  
  
    });
   &lt;/script&gt;
   &lt;/head&gt;
   &lt;body&gt;
  
   &lt;ul id="sortable1" class="connectedSortable"&gt;
    &lt;li class="ui-state-default" id="k1"&gt;Item 1&lt;/li&gt;
    &lt;li class="ui-state-default"id="k2"&gt;Item 2&lt;/li&gt;
    &lt;li class="ui-state-default"id="k3"&gt;Item 3&lt;/li&gt;
    &lt;li class="ui-state-default"id="k4"&gt;Item 4&lt;/li&gt;
    &lt;li class="ui-state-default"id="k5"&gt;Item 5&lt;/li&gt;
   &lt;/ul&gt;
  
   &lt;ul id="sortable2" class="connectedSortable"&gt;
  
   &lt;/ul&gt;
  
   &lt;ul id="sortable3" class="connectedSortable"&gt;
  
   &lt;/ul&gt;
  
  
  
   &lt;/body&gt;
   &lt;/html&gt;
  </code></pre>