Load jQuery dynamically

Question

I am having issues with loading jQuery with Javascript. I need to load it with Javascript because there are conditions that I only can know client-side. The commented out code is supposed to initialize the scripts, but I am having no luck with them.

var script_tag = document.createElement('script');
script_tag.setAttribute("type","text/javascript");
script_tag.setAttribute("src","http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js")
//script_tag.onload = main; // Run main() once jQuery has loaded
//script_tag.onreadystatechange = function () { // Same thing but for IE
    //if (this.readyState == 'complete' || this.readyState == 'loaded') main();
//}
document.getElementsByTagName("head")[0].appendChild(script_tag);

http://mybsabusiness.com/samplesites/silver/sbsa01/

This is the site that the problems are on.

Answer 1

From the jQuerify bookmarlet :

function getScript(url, success) {
    var script = document.createElement('script');
    script.src = url;
    var head = document.getElementsByTagName('head')[0],
        done = false;
    // Attach handlers for all browsers
    script.onload = script.onreadystatechange = function() {
      if (!done && (!this.readyState
           || this.readyState == 'loaded'
           || this.readyState == 'complete')) {
        done = true;
        success();
        script.onload = script.onreadystatechange = null;
        head.removeChild(script);
      }
    };
    head.appendChild(script);
}
getScript('http://code.jquery.com/jquery-latest.min.js',function() {
    // Yay jQuery is ready \o/
});​