jquery loading time issue

I'm having an issue with getting jQuery & Bootstrap.js to load and play nicely. I can put them in the header and they work fine, but I have a 'master page' which loads 3 subforms on them. Thus on each form, I need to assure jQuery & Bootstrap.js are loaded but I cannot have them reload or it is causing issues.

So, I've created a jsfiddle that I'm using to assure jQuery is loaded before I then check to see if bootstrap.js is loaded (and load it if it is not). The problem is that code after the jQuery check seems to be executing before jQuery finishes loading despite trying to put a delay in to assure it does not.

Here is the code:

if(typeof jQuery=='undefined') {
    var headTag = document.getElementsByTagName("head")[0];
    var jqTag = document.createElement('script');
    jqTag.type = 'text/javascript';
    jqTag.src = '//code.jquery.com/jquery-2.0.3.min.js';
    jqTag.onload = myJQueryCode;
    headTag.appendChild(jqTag);
} else {
    alert('You are here')
    myJQueryCode();
}
function yourFunctionToRun(){
    //Your JQuery goodness here
}

function runYourFunctionWhenJQueryIsLoaded() {
    if (window.$){
        //possibly some other JQuery checks to make sure that everything is loaded here
        myJQueryCode();
    } else {
        setTimeout(function() {runYourFunctionWhenJQueryIsLoaded()}, 50);
    }
}

runYourFunctionWhenJQueryIsLoaded();
if(typeof jQuery=='undefined') {
    alert('Houston we have a problem');
}

Here is the jsfiddle

Based on this fiddle, the alert windows should never open as it should not reach that until after jQuery is loaded.

Any help would be greatly appreciated.