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?

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?

• javascript
• html
• dynamic

Share Improve this question Follow edited Feb 1, 2015 at 16:38 Deduplicator 45.8k77 gold badges7272 silver badges123123 bronze badges asked Sep 5, 2012 at 18:15 user1612226user1612226 2911 silver badge66 bronze badges 6

• I'd rather do it pure javascript. However, I'd love to hear any suggestions. – user1612226 Commented Sep 5, 2012 at 18:18
• @user1612226 - are you sure that doesn't work? I do something like that all the time. – Travis J Commented Sep 5, 2012 at 18:19
• @user1612226 Updated the answer with both jQuery and Pure JavaScript way... :) – Praveen Kumar Purushothaman Commented Sep 5, 2012 at 18:20
• possible duplicate of JavaScript: remove element by id – locrizak Commented Sep 5, 2012 at 18:20
• What you've got should work. Additionally, there's no need to re-query the DOM. Just use your original reference: divTag.parentNode.removeChild(divTag); – Joseph Silber Commented Sep 5, 2012 at 18:21

 |  Show 1 more ment

4 Answers 4

Sorted by: Reset to default 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);
}

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);​

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);
}

Check Node.removeChild

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