Drag and Drop not working - symbol disappears when I try to drag

Question

I have a large animation I am making in Edge Animate, and have already used the draggable jquery plugin several times. However yesterday I made a new symbol for a separate animation, and then added elements and turned them into symbols, and added the following code to the symbol timeline on creationComplete:
sym.$("milk-s").draggable();
I have tried it with several different symbols, but each time I check it in a browser, I click on the symbol to drag and it disappears instead. I can't understand what I'm doing wrong, as that is all the code in the timeline actions, and I'm sure there's no code on the symbols I want to drag. I have also copied and pasted the code from draggable symbols that work, and changed the name, as they have slightly more code on for when you start dragging the symbol.
Thanks in advance!

Answer 1

Not sure what I did wrong before, but it's working now! Although it's not doing the next thing I want it to do now. Here's the code I have:
sym.$('drink-can-s').draggable({ revert: 'invalid' });
sym.$("milk-s").draggable({ revert: 'invalid' });
sym.$("tin-can-s").draggable({ revert: 'invalid' });
sym.$("green-bottle-s").draggable({ revert: 'invalid' });
sym.$("box-s").draggable({ revert: 'invalid' });
sym.$("eggshells-s").draggable({ revert: 'invalid' });
sym.$("apple-s").draggable({ revert: 'invalid' });
sym.$("carrots-s").draggable({ revert: 'invalid' });
sym.$("banana-s").draggable({ revert: 'invalid' });
sym.$('compost').droppable({
accept:sym.$("banana-s"),
accept:sym.$("apple-s"),
accept:sym.$("eggshells-s"),
accept:sym.$("carrots-s"),
sym.$('recycle-drag').droppable({
accept:sym.$("drink-can-s"),
accept:sym.$("milk-s"),
accept:sym.$("tin-can-s"),
accept:sym.$("green-bottle-s"),
accept:sym.$("box-s"),
There are several draggable symbols and two droppable symbols, each draggable symbol can be put into one droppable symbol, and I want the draggable symbol to go back to it's original position if it is dragged anywhere but the correct droppable symbol. I have used revert: 'invalid' for this, but all of the draggable symbols spring back to their original position, but a bit lower down, even when dropped onto the correct droppable symbol, except "carrots-s", which isn't affected by revert: 'invalid'. Any idea what's happening?