Is it possible to divorce a div from it's parent?

I've got an app here: http://www.colugo.org/jmcmurra/generators_test/tools/wheel/wheel.htm

The gallery on the right contains some images that can be dragged and dropped onto the wheel on the left. It worked great until I added the sliding animation for the gallery. Now, because of the way the sliding is set up (great widget found here: http://labs.adobe.com/technologies/spry/samples/slidingpanels/SlidingPanelsSample.html).

Because the counters are originally in the sliding divs, they can no longer be dragged out of the gallery.

Is it possible to divorce a div from it's parent and then return it later? It seems like I might be able to delete it from the dom and recreate it as a child of the body, then reverse the process when it needs to return, but I'm not sure if that can be done, nor how to go about it if it can.

Any help would be greatly appreciated!

 

you have two ways to handle this :

Create a new DIV where you want to move the current object then use :

oldDiv = Object.replaceChild(newDiv, oldDiv)

Code (markup):

or if you are using the dom allready like so :

Obj=document.createElement('DIV');

Code (markup):

then Any new insertion will move it. A DOM node can only occour once in a
document, so inserting it a new place will remove it from its previous
location.
No need to remove. Just insertBefore where you need it.

someToBeParentNode.insertBefore(Obj,someNewSibling );

Code (markup):