Dynamically adding a script tag to loaded HTML - error in IE7&8

Question

I've been stuck on this for quite a while - any help would be really appreciated.

Basically I'm loading HTML into a page, but the loaded HTML needs to contain an external script in specific position within it. I found the best way to do this was using the following code:

$('#blah').load('blah.htm',
    function(){
        var script = document.createElement('script');
        script.type = 'text/javascript';
        script.src = "[external script url + query string here]";
        $('#blah_blah')[0].appendChild(script);                 
});

Edit: The reasons I'm using "appendChild" instead of jQuery's "append" is that $.append adds the videoplayer created by the script to completely the wrong element. If I use appendChild, it is added to the correct element specified. I think this maybe to do with jQuery's insertion methods, as outlined within this answer: Can't append <script> element

The code I'm using works great in Firefox and Chrome, but in IE7 & 8 I get the error message "Unable to get value of the property 'appendChild': object is null or undefined", and the script tag cannot be seen in the DOM.

If I include the line:

$("#blah_blah")[0].appendChild(document.createTextNode("test"));

the text node "test" is added to the DOM, and can be seen on the page - so it seems "appendChild" does work, but there is an issue with appending a script tag.

Could it possibly be an IE specific security issue?

Answer 1

What's wrong with:

   $.getScript("script.js");