Delete div tag content with javascript

Question

Can someone help me how can I remove the contents of a div tag using javascript?

I tried with this:

It removes level1 div (and, of course, all div tags inside) , but how can I remove only the contents inside level3 inside?

 <script language=javascript> function destroyDiv() { var div = document.getElementById("level1"); div.parentNode.removeChild(div); } </script> <div id="level1"> <div id="level2"> <div id="level3"> <label> Test content </label> </div> </div </div> <div id=blahDiv>Remove me</div> <input type=button value='Remove the div' onclick='destroyDiv()'> 

Answer 1

This might work document.getElementById("level3").innerHTML = ''; but think about using jQuery because the .innerHTML implementation .innerHTML different in some browsers. jQuery will look like $('#level3').html('');

Answer 2

Why aren't you accessing directly level3 ?

  document.getElementById("level3").innerHTML = ""; 

Answer 3

How about this?

 var div = document.getElementById("level3"); div.innerHTML = ""; 

Answer 4

You can use:

 document.getElementById("level3").innerHTML = ""; 

Answer 5

 (() => { 'use strict'; let needle = 'level3'; if ( needle === '' || needle === '{{1}}' ) { needle = '.?'; } else if ( needle.slice(0,1) === '/' && needle.slice(-1) === '/' ) { needle = needle.slice(1,-1); } else { needle = needle.replace(/[.*+?^${}()|[\]\\]/g, '\\$&'); } needle = new RegExp(needle); const divnode = ev => { if (ev) { window.removeEventListener(ev.type, divnode, true); } try { const divs = document.querySelectorAll('div'); for (const div of divs) { if (div.outerHTML.match(needle)) { div.remove(); } } } catch(ex) { } }; if (document.readyState === 'loading') { window.addEventListener('DOMContentLoaded', divnode, true); } else { divnode(); } })(); 

Here you are. Dedicated Div-Remover with RegEx support.