Bhargavi
Bhargavi

Reputation: 851

how to remove child div using javascript

this my html

<div>
    <div id="div2" ondrop="drop(event)" ondragover="allowDrop(event)"></div>
</div>

this my script

var list=document.getElementById("div2");
list.removeChild("div2""));

when i click the buttton i need to remove the child div(div2) how to do that. using this code i am facing problem please tell. help me . we have any other solution for this problem

Upvotes: 5

Views: 21851

Answers (4)

Gibolt
Gibolt

Reputation: 47287

Use modern JS!

const div = document.getElementById("div2");
div.remove();

or just

document.getElementById("div2").remove()

Upvotes: 2

try removing the elements like this

//HTML MARKUP

<div id="div1">
<div id="div2" ondrop="drop(event)" ondragover="allowDrop(event)"></div>
</div>

//Javascript
var list=document.getElementById('div1');

list.removeChild(list.getElementById('div2'));

Upvotes: 0

Satpal
Satpal

Reputation: 133453

You need to find div2 parent and then you can use removeChild to remve div2

var list=document.getElementById("div2");
var parentDiv = list.parentNode;
parentDiv.removeChild(list);

Demo

Problem in your code

list.removeChild("div2"")); <<== ") is additional

Upvotes: 3

Sam Braslavskiy
Sam Braslavskiy

Reputation: 1288

you have double quotes and double braces at the end. And I'm not sure what you're trying to do. If you'd like to remove element with the id "div2", use:

var list=document.getElementById("div2");
list.parentNode.removeChild(list);

Upvotes: 11

Related Questions