Dynamically loading javascript source from a string into the DOM using Jquery

Dynamically loading javascript source from a string into the DOM using Jquery

I'm experimenting with dynamic loading of javascript using JQuery. So basically I have a loadScript function that accepts either the URL of a JS file or a javascript source in a string.

For the former, I create a 'script' element, set its src attribute to the URL of the file and insert the element into the DOM's head element. So far it seems to work nicely.

For the latter, I create a 'script' element, set its innerHTML to the JS string and insert it into the DOM's head element. This doesn't work so well. I *think* it's because the JS source in question contains:

$(document).ready(function() {
    // put all your jQuery goodness in here.
});

It looks like the JS source in my string is stomping over parts of the DOM it shouldn't and changing existing elements.

Is the latter possible? Is my approach completely wrong?

Thanks