JQuery Draggables, Delete/Destroy/Remove Dynamically
<p>I have a program that can dynamically add draggables using some sneaky code like this: </p>

<pre><code>(function ($) {
   $.fn.liveDraggable = function (opts) {
      this.live("mouseover", function() {
         if (!$(this).data("init")) {
            $(this).data("init", true).draggable(opts);
         }
      });
      return $();
   };
}(jQuery));

$("#draggable_component").liveDraggable({ 
    scroll: true,
    handle: ".drag_handle",         
    containment: ".middle_container"
});
</code></pre>

<p>This code works fine. I have two related problems which I cannot resolve. First, every time I add a draggable it is added to a different spot on the screen. Second, every time I delete a draggable (which I have been doing with .hide() 'cause I can't get remove or destroy to work), all the draggables shift over. Unfortunately I cannot make the positioning of the draggables absolute at this time.</p>

<p>If someone could help me find a solution to these problems, that would be greatly appreciated.</p>

<p>I feel like switching everything to absolute positioning may be one solution, but damn, I have to change a lot of old code if that is the case... Hoping for another solution. </p>
