I have a some draggables in a list of droppables (1 draggable per droppable li).

When I move a draggable from one droppable to another free droppable, I want to diable the receiving droppable, and enable the droppable it is leaving from.

In firebug the droppable class gets removed – but the functionality of the droppable remains. I have a feeling I need to use live() somehow, but could use a leg-up.

$(function() {
$(".user").draggable({
  revert          : true, 
  revertDuration  : 200
});


  $("li.droppable").droppable({
    accept      : ".user",
    hoverClass  : "drophover",
    drop: function(event, ui) {
      var position  = this.getAttribute("id").replace("position_", ""),
        user_id = ui.draggable.attr("id").replace("user_", "");
        droppable = this
        parent    = ui.draggable.parent()
      $.ajax({
        url   : "users/"+user_id+"",
        type  : "POST",
        dataType: "JSON",
        data  : ({
          "position"  : position,
          "_method"   : "PUT"
        }),
        success : function() {
          $(ui.draggable).parent().addClass("droppable");
          $(ui.draggable).appendTo(droppable);
          $(parent).removeClass("droppable");
        }
      });
    }
  });
});