removeChild function

JavaScript
1

I try to make something where you add elements, and can delete elements later by calling a simple function.

I simplyfied it right here:
It works only to add the paragraphs, but the delete function doesn’t work.

Anyone tips?

Tried already to debug with an alert message after each rule… but the problem is with this rule I guess:

last.parenNode.removeChild(thepar);

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>

<script type="text/javascript">




function addPars() {
     var par = document.createElement("p");
         par.setAttribute("id", "newpar");

     last.parentNode.insertBefore(par,last); 
     par.innerHTML = "this is a new par";
}


function delPars() {

  var thepar = document.getElementById("newpar");
  last.parenNode.removeChild(thepar);

}




function thefunction(){
     var last = document.getElementById("last");
     var add = document.getElementById("add");
   add.onclick = addPars;
     
     var del = document.getElementById("del");
   del.onclick = delPars;
}


window.onload = thefunction;

</script>

<title>test</title>
</head>
<body>
 


<p id="last">new paragraphs come before this one</p>

<p id="add">add pars</p>
<p id="del">delete pars</p>

</body>
</html>
2

You have a typo: it’s parentNode, not parenNode.

Also, what you have will not work. The “last” variable is local only to the function it’s in. This will work though:

thepar.parentNode.removeChild(thepar);

In addition, you have a major flaw with your addPars code - if the user clicks “add pars” more than once, you will end up with more than one element with the same id (newpar). This is forbidden in HTML. So you will need to generate a new id for each one, but this is rather messy. You’d be better off just using a class.

3

Oh, thanks a lot. And I’m already searching for hours to this tiny thing…

Yes I see… But actually, this is just an simplyfied example. In the script I’ll use this, I’m not going to generate multiple paragraphs.
But thanks for the tip, I guess I wouldn’t have thought about it either…