Javascript set CSS: после стилей

Question

Можете ли вы установить: после стилей CSS с Javascript?

Итак, скажем:

$("#foo li:after").css("left","100px");

Answer 1

var addRule = (function(style){
    var sheet = document.head.appendChild(style).sheet;
    return function(selector, css){
        var propText = Object.keys(css).map(function(p){
            return p+":"+css[p]
        }).join(";");
        sheet.insertRule(selector + "{" + propText + "}", sheet.cssRules.length);
    }
})(document.createElement("style"));

addRule("p:before", {
    display: "block",
    width: "100px",
    height: "100px",
    background: "red",
    "border-radius": "50%",
    content: "''"
});

Минимальная реализация. Скорее всего, вы захотите отслеживать добавленные вами правила, чтобы их можно было удалить. sheet.insertRule возвращает индекс нового правила, которое можно использовать для получения ссылки на него для редактирования или удаления.

Редактировать: добавлены базовые функции для преобразования объекта в строку свойств css для удобства.