can't remove dynamically added scripts

append, javascript, removechild

Solution

You can remove elements using `removeChild`:

var head = document.getElementsByTagName('head')[0];

//removing them from the head, where you added them
head.removeChild(script);
head.removeChild(style);

However:

- Removed style/link elements will remove the styles defined in them.

- But JS can't be unloaded this way. They will remain in memory. It would be better if you had some logic to manage your scripts, like some dependency manager.

Thus removing style/link elements might have some use, but there is no use removing script elements.

Problem

I am appending a child element with a reference to at javascript and a stylesheet, but I would like to delete it again when there is no use of it anymore. ``` var head = document.getElementsByTagName('head')[0]; // We create the style var style = document.createElement('link'); style.setAttribute("rel", "stylesheet"); style.setAttribute("type", "text/css"); style.setAttribute("href", '_css/style.'+app+'.css'); var script = document.createElement('script'); script.setAttribute("type", "text/javascript"); script.setAttribute("src", '_scripts/_js/script.'+app+'.js'); // And the append the style head.appendChild(style); head.appendChild(script); ``` This is how I append the scripts and it works perfectly.. But I can't figure out how to delete the tags again from the head tag in HTML. Does anybody know how to remove the tags from the header tag again.. I have been searching all around Stackoverflow but nobody actually seem to have this kind of problem, but if anybody knows there is another question answering this, please tell me..

Original source

Related problems