native code to include a javascript / css file dynamically in a html document

include.js

function include(src, callback) {
	var ext = src.split(/[\#\?]/)[0].split(".").pop().toLowerCase();
	var inc;
	if (ext == "js") {
		inc = document.createElement("script");
		inc.src = src;
		inc.onload = inc.onreadystatechange = callback;
	}
	else {
		inc = document.createElement("link");
		inc.rel = "stylesheet";
		inc.type = "text/css";
		inc.media = "screen";
		inc.href = src;
		if (callback)
			callback ();
	}
	document.getElementsByTagName("head")[0].appendChild(inc);
};

// example of use 1/2: load a CSS and a JS file in the same time
include("http://mysite.com/bookmarklet.css");
include("http://mysite.com/bookmarklet.js");

// example of use 2/2: loading a list of JS and CSS files sequentially
var toInclude = [
	"bookmarklet.css",
	"bookmarklet.js"
];
(function loadNext(){
	if (toInclude.length)
		include("http://mysite.com/" + toInclude.shift(), loadNext);
	else
		console.log("everything is loaded!"); // your code here
})();