jQuery drag-and-drop to reorder a generated table

I have a table that starts out with a header and footer, and the user adds rows to it.

I would like for the user to be able to organize these rows in some way, and it seems drag-and-drop is the most intuitive.

I can't seem to find a plugin, or otherwise code something, that works on live content similar to how .delegate or .live work. Any ideas?

开发者_如何学JAVA*Edit:

I came up with this as a temporary solution to rearrange user-added rows (I put up and down arrows in the table, with the class .uparrow and .downarrow). I am still hoping to find a way to drag and drop them.

If anyone is interested, here is the code for the arrows:

$('#garmenttable').delegate('.uparrow','click',function() { 
    var thisObj = $(this).closest('tr');    
    var prevTR = thisObj.prev('tr:not(.header)');
    if(prevTR.length) {        
        prevTR.before(thisObj.clone(true, true));
        thisObj.remove();
    }
});
$('#garmenttable').delegate('.downarrow','click',function() { 
    var thisObj = $(this).closest('tr');    
    var nextTR = thisObj.next('tr:not(.footer)');
    if(nextTR.length) {        
        nextTR.after(thisObj.clone(true, true));
        thisObj.remove();
    }
});

I deal with a similar problem time ago, and working with drag and drop in tables was a big headache. I finished replacing it by divs. Anyway, maybe you can do it using a 'proxy' element for dragging, and not drag the table row itself. Here you can find the sample using proxy > http://threedubmedia.com/code/event/drag/demo/proxy

I'm using these plugins for drag and drop, they are really great http://threedubmedia.com/

Sorry about my english.