JavaScript: Insert/Remove/Replace Element

By Xah Lee. Date: . Last updated: .

Insert as Sibling or Child

node.insertAdjacentElement(position, newNode)

insert a new node as previous/next sibling, or as first/last child.

see insertAdjacentElement

Insert as Child


insert a new node as last child. [see appendChild (Append Element as Child)]

parent.insertBefore(newNode, nodeX)
Inserts newNode as a new child of parent before nodeX.

Remove Child

see Remove HTML Element

Replace Child

parent.replaceChild(newNode, oldNode)
Replaces the child node oldNode of parent with newNode.

If newNode is in the same doc, move it to the new place.

Remove All Children

JavaScript in Depth

Basic DOM Element Methods

DOM Scripting


DOM Methods

Basic Examples

HTML Input

Web Scripting Examples

Web Scripting Misc