Add CSS rules dynamically

add_css_dynamically.js

/**
 *  Add CSS rules dynamically
 *  Example:
 *      dyn_css_rule("#menu li:hover", "color: red")
 */
window.dyn_css_rule = function(sSelector, sCssText) {
    try {
        var aSS = document.styleSheets;
        var i;
        for (i=aSS.length-1; i>=0; i--) {
            var oCss = document.styleSheets[i];
            var sMedia = (typeof(oCss.media) == "string")?
                oCss.media:
                oCss.media.mediaText;
            if (!sMedia
                || sMedia.indexOf("screen") != -1
                || sMedia.indexOf("all") != -1
            ) {
                break;
            }
        }
        if (oCss.insertRule) {
            oCss.insertRule(sSelector + " {" + sCssText + "}", oCss.cssRules.length);
        } else if (oCss.addRule) {
            oCss.addRule(sSelector, sCssText);
        }
    } catch(err) {
        var tag = document.createElement('style');
        tag.type = 'text/css'; 
        try {
            tag.innerHTML = sSelector + " {" + sCssText + "}";
        } catch(err) {
            tag.innerText = sSelector + " {" + sCssText + "}";
        }
        document.getElementsByTagName('head')[0].appendChild(tag);
    }
    return sSelector + "{" + sCssText + "}";
};