Adding and Removing Nodes (HTML Elements)
Creating New HTML Elements (Nodes)
To add a new element to the HTML DOM, you must create the element (element node) first, and then append it to an existing element.
Example
<div id="div1">
<p id="p1">This is a paragraph.</p>
<p id="p2">This is another paragraph.</p>
</div>
<script>
const para = document.createElement("p");
const node = document.createTextNode("This is new.");
para.appendChild(node);
const element = document.getElementById("div1");
element.appendChild(para);
</script>
Example Explained
This code creates a new <p> element:
const para = document.createElement("p");
To add text to the <p> element, you must create a text node first. This code creates a text node : Continue reading JavaScript HTML DOM Elements (Nodes)