I'm trying to do this with pure javascript, not with jquery. I have a div that has an id test and contains other divs inside it. How do I empty the content of this div and replace it with other html?
<div id="test">
<div>...</div>
<div>...</div>
<div>...</div>
</div>
document.getElementById("test").innerHTML = "new content"
clear the div:
document.getElementById('test').innerHTML = '';
replace it :
var h1 = document.createElement('h1');
h1.innerHTML = "hello world!";
document.getElementById('test').appendChild(h1);
Use document.getElementById('test').innerHTML = ''.
Off the top of my head, I think this should work....
document.getElementById("test").innerHTML = "";
innerHtml not being innerHTML. I'll upvote to counter; that's mean.document.getElementById("test").innerHTML = "Some other Content";
var testDiv = document.getElementById("test");
testDiv.innerHTML = "<h5>It works!</h5>";
There's also an
Element.replaceWith()
https://developer.mozilla.org/en-US/docs/Web/API/Element/replaceWith
