Guten Tag

Ich möchte erstmal sagen, das ich bisher mit jquery nichts zutun hatte. Habe nur mit php, mysql meine erfahrungen gemacht. Als Hobbyprogrammierer ha man halt nicht so die Kenntnisse. Also bitte nicht gleich schimpfen.

Jetzt zu meinem Sorgenkind. Ich erklär erstmal was ich vorhab.

Ich habe eine Gallerie an Bildern die Spieler beinhalten. Nun gibt es mehrere Felder, welche mit diesen Bildern ausgefüllt werden sollen.

Diesen jquery Code habe ich mir zusammengestückelt.
Code:
$( function() {
	
	$( "#draggable img" ).draggable({
		helper: "clone",
		revert: "invalid"
	});
	$( "#pole, #p2, #p1, #p3, #fl" ).droppable({
		accept: "#draggable img",
		drop: function ( event, ui ) {
			
			$(ui.draggable).clone().appendTo(this);
			
		}
	});
	
});
Nun zu meinen Punkten, wo ich hänge. Zum einen kann ich das eingefügte Bild nicht wieder rausholen und wenn ich ein zweites oder drittes reinziehe, werden diese untereinander dargestellt. Es soll aber immer nur eins drin stehen, welches man wieder herausziehen kann.

Ich hoffe es war halbwegs verständlich und ihr könnt mir man einen Tip geben, was ich falsch gemacht habe.

Thx