Script tags added via jQuery not visible in FireBug

Question

I am adding <script type="text/javascript" src="http://somedomain/somescript.js"> to the document head via jQuery. This is the code I use:

$(document).ready(function () {
    var s = document.createElement("script");
    s.type = "text/javascript";
    s.src = (document.location.protocol == "https:" ? "https://ssl" : "http://www") + ".google-analytics.com/ga.js";
    $("head").append(s);
});

While the script seems to be working perfectly, I do not see the scripts in the head when I use FireBug to inspect document head. This snippet does not show the added script(s) either:

$('script[src]').each(function(){
    console.log(this.src);
});

Is this normal or am I doing something wrong here? What bothers me is the fact that I see other scripts in the head section that were lazy/dynamically loaded but not those that I added. Also wondering if it is OK to load scripts that manipulate DOM in the document ready function.

UPDATE

Replacing the code from:

$("head").append(s);

to

document.getElementsByTagName("head")[0].appendChild(s);

fixes the problem. The resulting DOM appears correctly in FireBug and jQuery correctly returns the script tags that were added static/dynamically.

Answer 1

You will see a request being made to the script in the NET tab but the script tag won't be visible when inspecting the DOM. This seems like a bug in FireBug.

Answer 2

This is a bug in Mozilla's 'jsd' debugger support. One workaround is post on the on the bug cited above:

http://code.google.com/p/fbug/issues/detail?id=1774

If jquery used eval() instead of script tag injection then you could debug this in Firebug.