Move a node in the DOM tree using JavaScript

This example script uses the dom methods appendChild and removeChild to move the image around the dom tree. Clicking on any of the boxes will make the image a child node to that div. Clicking the button below will then print the current dom tree starting and ending with the first 'table' element.

removeChild returns a reference to the 'removed' node which is then used by appendChild to move the node. According to mozilla, the removeChild removes the node from the DOM tree but the node is still in memory, therefore the usefulness of the returned object reference from removeChild.

smiley face


Some places I can be found