JavaScript, library, jQuery and CSS loading via code

Several parts have been commented out, and tiny bits added in, because jsfiddle cannot perform script loading and jQuery ajax operations

by alano

HTML

<!-- EXAMPLE OF CLIENT'S TEST PAGE -->
<div id="main">
    <img class="XX-click" />
    <p>Blah blah blah blah</p>
    <p>Blah blah blah blah</p>
    <p>Blah blah blah blah</p>
    <p>Blah blah blah blah</p>
    <p>Blah blah blah blah</p>
    <p>Blah blah blah blah</p>
    <img class="XX-click" />
    <p>Blah blah blah blah</p>
    <p>Blah blah blah blah</p>
    <p>Blah blah blah blah</p>
    <p>Blah blah blah blah</p>
    <p>Blah blah blah blah</p>
    <p>Blah blah blah blah</p>
    <img class="XX-click" />
</div>

CSS

.XX-popup {
    display:none; 
    position:absolute; 
    height:60%; 
    width:60%; 
    top:20%; 
    left:20%; 
    border-style: ridge;
    background-color:White;
    z-index:+1;
}
.XX-click {
    cursor:pointer;
    width:50px;
}

JavaScript

/************************************************
* XX loader
************************************************/

//JavaScript helper to load javascript library and notify completion 
function getScript(url, callback) {
    var script = document.createElement("script")
    script.type = "text/javascript";
    if (script.readyState) { //IE
        script.onreadystatechange = function () {
            if (script.readyState == "loaded" || script.readyState == "complete") {
                script.onreadystatechange = null;
                if (typeof callback == "function") callback();
            }
        };
    } else { //Others
        script.onload = function () {
            if (typeof callback == "function") callback();
        };
    }
    script.src = url;
    document.getElementsByTagName("head")[0].appendChild(script);
}

//jQuery helper to load CSS file
function loadCSS(url) {
    $("<link>", { rel: "stylesheet", type: "text/css", href: url }).appendTo("head");
}

//Start loading process...
/* won't work on JSFIDDLE getScript("//ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js", goXX); */ goXX();
/* won't work on JSFIDDLE getScript("http://www.mydomain.com/jquery.dimensions.js"); */

var $popup; //global reference to popup window, so we only have one per page

//jQuery library now loaded, start preparing page
function goXX() {
    $(document).ready(function () {
        //once jQuery library fully constructed...
        /* won't work on JSFIDDLE loadCSS("http://www.mydomain.com/th.css"); */ 
        var xxServiceURL = "http://www.mydomain.com/index.htm";
        var xxImageURL = "http://jquery.org/wp-content/uploads/2010/01/JQuery_logo_color_onwhite-300x74.png"; //image.png hosted on www.mydomain.com
        //set attributes for all XX image markers
        $("img.XX-click").attr({ src: xxImageURL, alt: "XX logo", title: "Click for content" }).click(function () {
            if (!$popup) {
                //create (hidden) popup window with Close...