JSFiddle - React, Tailwind, and code Playground

JavaScript

var selector = "a";
var styleText = "font-size: smaller";
var ruleText = selector + " { " + styleText + " }";

var testElementContainer = document.createElement("div");
document.body.appendChild(testElementContainer);

function createFromMarkup(markup)
{
    var range = document.createRange();
    var fragmentContainer = document.createElement("div");
    range.selectNodeContents(fragmentContainer);
    testElementContainer.appendChild(fragmentContainer);
    var fragment = range.createContextualFragment(markup);
    fragmentContainer.appendChild(fragment);
    return fragmentContainer.firstChild;
}

var rule = createFromMarkup("<style>@media screen { a { text-weight: bold } }</style>").sheet.cssRules.item(0);
rule.insertRule(ruleText, 0);
console.log(rule.cssRules.length);
try {
    console.log(rule.cssRules.item(0));
} catch (e) {
    console.log(e);
}
try {
    console.log(rule.cssRules.item());
} catch (e) {
    console.log(e);
}