title: Removing Items from Jquery UI Sortable
body: <p>I'm trying to find out the correct way to remove items from a JQuery UI Sortable list. I've created a JSfiddle illustrating my problem.</p>
  
  <p>Basically, I have a couple of callbacks around a JQuery UI sortable widget, and I want these callbacks to be executed as soon as I remove an element from the widget. What's the correct way to do so? Because "$.remove" nor "$.detach" seems to work.</p>
  
  <p><strong>EDIT 1: I'm not looking for a hotfix on my problem but more of an explanation of how the JQuery UI Sortable list works, while the answers below clearly solve the problem. I don't think it's a clean way of doing it. I think that JQuery UI Sortable should be aware that when you remove an element from the list that's between two elements you should be needing a re-sort</strong> </p>
  
  <p>If you take note below the function does not gets executed when I call remove on an element.</p>
  
  <pre><code>$(document).ready(function(){
      $('ul').sortable({
          stop: function(event, ui) {
              updatePosition();
          }
      });
  
      $('.remove').on('click', function(e){
          $(".delete").remove();
      });
  });
  
  function updatePosition(){
      $('ul li').each(function(i){
          $(this).html(i + 1);
      });
  }
  </code></pre>
  
  <p><a href="http://jsfiddle.net/72RTz/2/" rel="nofollow">http://jsfiddle.net/72RTz/2/</a></p>