JSFiddle - React, Tailwind, and code Playground

by ncapito

HTML

<script src="http://www.timdown.co.uk/rangy/rangy-current/rangy-core.js"></script>
<script src="http://www.timdown.co.uk/rangy/rangy-current/rangy-cssclassapplier.js"></script>
<textarea id="output" rows="10" cols="80"></textarea>

JavaScript

function applyCssClassToHtml(cssClass, html) {
    rangy.init();
    var cssClassApplier = rangy.createCssClassApplier(cssClass);
    var div = document.createElement("div");
    div.innerHTML = html;
    document.body.appendChild(div);
    var range = rangy.createRange();
    range.selectNodeContents(div);
    cssClassApplier.applyToRange(range);
    range.detach();
    document.body.removeChild(div);
    return div.innerHTML;
}

document.getElementById("output").value = applyCssClassToHtml("someClass", "Hello <b>world</b>");