Question

The platform I am working on needs to dynamically load Javascript files that embed a flash video into a specified div. We shall call the div id “target”. The Javascript file is appended into the div properly. However the flash video contents do not load. How can I ensure that the embed scripts execute after the document has been loaded?

var div = document.getElementById("target");
var newScript = document.createElement("script");
newScript.setAttribute("type","text/javascript");
newScript.setAttribute("src","http://www.go.url");
div.appendChild(newScript);

Answer 1

Listen for the load event from the document then load your script:

function loadJS() {
    var s = document.createElement('script'); s.type = 'text/javascript'; s.async = true;
    s.src = '//www.goraceday.com/embed/14/1651/';
    var x = document.getElementsByTagName('script')[0]; x.parentNode.insertBefore(s, x);
}
if (window.addEventListener) window.addEventListener('DOMContentLoaded', loadJS, false);
else if (window.attachEvent) window.attachEvent('onload', loadJS);