javascript - Removing innerHTML img element completely -

typebox.innerhtml += "<div class='typebox'><img id='typeimg' width='30px' height='30px' src="+d[o].src+"></div>"; 

i using innerhtml add multiple images, , need images removed clicking on remove button, can't figure out how this.

i have tried:

var typebox = document.getelementbyid("typebox"); typebox.style.display = 'none'; 

using display:none; makes images not show @ all.

var typebox = document.getelementbyid("typebox"); typebox.innerhtml = ""; 

it seems won't remove images, more doing nothing @ all.

so how should remove images completely?

try this:

removechild in case

var typebox = document.getelementbyid('typebox');  typebox.innerhtml += "<div class='typebox'><img id='typeimg' width='300px' height='300px' src='https://www.google.co.in/images/branding/googlelogo/2x/googlelogo_color_272x92dp.png'></div>";  document.getelementbyid('removebtn').addeventlistener('click', function () {      var toremove = document.getelementbyid('typeimg');      toremove.parentnode.removechild(toremove);  });

<div id='typebox'></div>  <button id='removebtn'>remove</button>

i hope helps..