The following code shows an Example of remove() Method in JavaScript

Programmingempire

Demonstrating Example of remove() Method in JavaScript

Basically, when a user opens the following HTML document in the browser, there are eight buttons. Each button has an id. When the user clicks on a button, the function f1() is called which in turn calls the remove() method for an element of the given id. As a result, that button is removed. So, the user needs to click on a button to remove it.

<html>
<head>
  <title>remove Method Demo</title>
  <script>
     function f1(id)
     {
	var x1=document.getElementById(id);
        x1.remove();
     }
  </script>
  <style>
    .c1{
       border: 4px solid #33ff99;
       border-radius: 10px;
       background-color: #5566aa;
       color: #aaffff;
       font-size: 20px;
       text-align: center;
       margin:5px;
       padding: 10px;
      }
    .a1{
		margin: 50px;
	}
    .c2{
       background-color: #ddeeff;
       color: #ff5566;
       font-size: 25px;
       text-align: left;
       margin:40px;
       padding: 5px;
       width: 800px;
      }
  </style>
</head>
<body>
  <div id="d1" class="c2"><br/><br/>
     Example of remove() Method<br/>
     Click on following button(s) to remove it.
     <br/><br/>
     <button id="b1" class="c1" onclick="f1(this.id)">Button 1</button>
     <button id="b2" class="c1" onclick="f1(this.id)">Button 2</button>
     <button id="b3" class="c1" onclick="f1(this.id)">Button 3</button>
     <br/><br/>
     <button id="b4" class="c1" onclick="f1(this.id)">Button 4</button>
     <button id="b5" class="c1" onclick="f1(this.id)">Button 5</button>
     <button id="b6" class="c1" onclick="f1(this.id)">Button 6</button>
     <br/><br/>
     <button id="b7" class="c1" onclick="f1(this.id)">Button 7</button>
     <button id="b8" class="c1" onclick="f1(this.id)">Button 8</button>
 </div>
</body>
</html>

Output

The Output of the Example of remove() Method in JavaScript
The Output of the Example of remove() Method in JavaScript

Further Reading

Evolution of JavaScript from ES1 to ES2020

Introduction to HTML DOM Methods in JavaScript

JavaScript Practice Exercise

programmingempire