JS DOM: Create and Insert HTML Element

By Xah Lee. Date: . Last updated: .

This page shows you how to use JavaScript to create an HTML element and insert it into a page.

Example

Press the following button to see a paragraph element inserted.

Code

<button id="button69908" type="button">Click Me</button>
const button69908 = document.getElementById("button69908");

const ff = (() => {
 const newNode = document.createElement("p");
 newNode.appendChild(document.createTextNode("hello"));
 button69908. insertAdjacentElement("afterend", newNode);
});

button69908 . addEventListener ("click", ff, false);

JS DOM Common Task How-To