JSFiddle - React, Tailwind, and code Playground

HTML

<p>Paragrafo</p>
<p class="p2">Paragrafo 2</p>

CSS

p {
    color: green;
    background-color: #ccc;
}
p.p2 {
    color: blue;
    font-size: 15pt;
}

JavaScript

/*
<p style="color: green;background-color: #ccc;">Paragrafo</p>
<p style="color: blue;background-color: #ccc;font-size: 15pt;">Paragrafo 2</p>
*/


var estilos = document.styleSheets; // CSSStyleSheet.rules
for (var i = 0; i < estilos.length; i++) {
    var regras = estilos[i].rules;
    for (var j = 0; j < regras.length; j++) {
        var str = regras[j].cssText;
        var seletor = str.split('{')[0];
        var style = str.match(/\{([^\{\}]*)\}/)[1];
        aplicar(seletor, style);
    }
}

alert(document.body.innerHTML);

function aplicar(seletor, regras) {
    console.log(seletor, '-', regras);
    var elementos = document.querySelectorAll(seletor);
    for (var i = 0; i < elementos.length; i++) {
        var el = elementos[i];
        var regrasExistentes = el.getAttribute('style') || '';
        el.setAttribute('style', regrasExistentes + regras);
    }
}