How to remove existing HTML elements in JavaScript?

JavascriptObject Oriented ProgrammingFront End Technology

To remove an existing HTML element removeChild() must be used. It removes any element from the parent element. 

syntax

removeChild(element);

It takes an element as a parameter and eliminates it from the DOM.

Example

In the following example, in the div section initially we have 2 texts. But when removeChild() method is used one of those texts is removed and only one text remains in the section. That text is displayed in the output.

Live Demo

<html>
<body>
<div id="new">
<p id="p1">Tutorix</p>
<p id="p2">Tutorialspoint</p>
</div>
<script>
   var parent = document.getElementById("new");
   var child = document.getElementById("p1");
   parent.removeChild(child);
</script>
</body>
</html>

Output

Tutorialspoint
raja
Published on 19-Jul-2019 17:29:39
Advertisements