How Do You Remove And Hide Html Elements In Plain Javascript?

I have this HTML:

John

Solution 1:

You need to pass an element reference to removeChild, not a string:

body.removeChild(document.getElementById('verifying'));

You could also just hide it:

document.getElementById('verifying').style.display = "none";

Solution 2:

your removeChild needs to get an element, not a string

var body = document.body;
var signup = document.getElementById("content-container");

setTimeout(function(){
    body.removeChild(document.getElementById('verifying'));
    signup.style.display = "block";
}, 5000);

Solution 3:

to remove you can use (as stated) removeChild:

var x = document.getElementById('elementid');
x.parentNode.removeChild(x);

And to hide an element:

var x = document.getElementById('elementid');
x.style.display="none";

EDIT:

oh and if you want it hidden but not taken "out of flow", use this:

var x = document.getElementById('elementid');
x.style.visibility="hidden";

Share