Javascript DOM Element remove child

Description

Javascript DOM Element remove child

View in separate window 

<!DOCTYPE html>
<head>
<title>removeChild</title>
<style>
p //from   www  .  j a  va 2  s . c o  m
{
   padding: 20px;
   margin: 10px 0;
   width: 400px;
   background-color: #eeeeff;
}
</style>
<script>

window.onload=function() {

   let paras = document.getElementsByTagName("p");
   for (let i = 0; i < paras.length; i++)
     paras[i].onclick=pruneparagraph;
}

function pruneparagraph() {
  let parent = this.parentNode;
  parent.removeChild(this);

  console.log("paras " + document.getElementsByTagName("p").length);
}

</script>

</head>
<body>
   <p>This is paragraph one</p>
   <p>This is paragraph two</p>
   <p>This is paragraph three</p>
   <p>This is paragraph four</p>
   <p>This is paragraph five</p>
</body>
</html>



PreviousNext

Related