MultiDrag and Drop, verschiebbare Elemente verschieden einhängen

[Moribundus]

Hallo Zusammen,

ich habe benutze Multi-Drag Funktion von Jquery UI, die verschiebbare Elemente anhand der Position im Dokument verschiebt und eine Drop Funktion selbs hinzugefügt.

siehe hier:

  
$(window).load(function(){  
	var selectedObjs;  
	var draggableOptions = {  
		start: function(event, ui) {  
			//get all selected...  
			if (ui.helper.hasClass('selected')) selectedObjs = $('div.selected');  
			else {  
				selectedObjs = $(ui.helper);  
				$('div.selected').removeClass('selected')  
			}  
			  
		},  
		drag: function(event, ui) {  
			var currentLoc = $(this).position();  
			var prevLoc = $(this).data('prevLoc');  
			if (!prevLoc) {  
				prevLoc = ui.originalPosition;  
			}  
  
			var offsetLeft = currentLoc.left-prevLoc.left;  
			var offsetTop = currentLoc.top-prevLoc.top;  
			  
			moveSelected(offsetLeft, offsetTop);  
			$(this).data('prevLoc', currentLoc);  
			globalElement = $(this);  
		}  
	};  
	  
	// Klasse welcher die Dragfunktion zugewiesen wird  
	$('.activity').draggable(draggableOptions).click(function(){$(this).toggleClass('selected')});  
  
$('.planning').droppable({  
  drop: function(event, ui) {  
    selectedObjs.appendTo(this);  
  }  
});  
  
	function moveSelected(ol, ot){  
		console.log("moving to: " + ol + ":" + ot);  
		selectedObjs.each(function(){  
			$this =$(this);  
			var p = $this.position();  
			var l = p.left;  
			var t = p.top;  
			console.log({id: $this.attr('id'), l: l, t: t});  
  
  
			$this.css('left', l+ol);  
			$this.css('top', t+ot);  
			  
		})  
	}  
});

und hier das html:

  
<table class="planningtable">  
	<tr>  
		<td class="planning"></td>  
		<td class="planning"></td>  
	</tr>  
	<tr>  
		<td class="planning"></td>  
		<td class="planning"></td>  
	</tr>  
</table>  
  
<table class="legend">  
	<tr>  
		<td>  
			<div id="drag1" onkeydown="deldiv()" class="activity" >FO</div><br>  
			<div id="drag2" onkeydown="deldiv()" class="activity" >FO</div><br>  
			<div id="drag3" onkeydown="deldiv()" class="activity" >FO</div><br>  
		</td>  
	</tr>  
</table> 

ich möchte nun erreichen das wenn ich mehrer Elemente verschiebe die sich in die Zelle(TD) einhängen in der sich in der Position des Dokumentes befinden, bisher hängen sich alle nur in die Zelle ein, wo ich das element hin verschiebe welches ich anfasse, obwohl sie sich an einer anderen Position befinden...

Kann mir jemand dabei helfen?

Vielen Dank im Vorraus...