动态删除元素

Question

I'm trying to remove an element that I created dynamically. This is how I created it...

var divTag = document.createElement("div");
divTag.id = "affiliation";
divTag.innerHTML = "Stuff Here";

I've tried several methods of removing it without success. Here's what I have so far.

var A = document.getElementById('affiliation');
A.parentNode.removeChild(A);

Suggestions?

Answer 1

If you wish to use jQuery , it is very easy to remove:

$("#affiliation").remove();

For the normal JavaScript , you can use this:

var node = document.getElementById("affiliation");
if (node.parentNode) {
    node.parentNode.removeChild(node);
}

Answer 2

Did you appended to the body or a parent?

var divTag = document.createElement("div");
divTag.id = "affiliation";
divTag.innerHTML = "Stuff Here";
document.body.appendChild(divTag);


element = document.getElementById("affiliation");
element.parentNode.removeChild(element);​

Answer 3

This snippet just works for me fine. The only difference is I added the "affiliation" divTag to the body

function insert() {
    var divTag = document.createElement("div");
    divTag.id = "affiliation";
    divTag.innerHTML = "Stuff Here";
    document.body.appendChild(divTag);
}
function remove() {
    var A = document.getElementById('affiliation');
    A.parentNode.removeChild(A);
}

Answer 4

Check Node.removeChild

var A = document.getElementById("affiliation");
if (A.parentNode) {
    A.parentNode.removeChild(A);
}