JSFiddle - React, Tailwind, and code Playground

by tomprogramming

HTML

<div class="editable"><span class="level1" style="font-weight:bold;">This is level'd text</span></div>


<button id="srcbtn">Show Source</button>
<div id="srcContainer"></div>

CSS

.editable {
    -webkit-user-modify:read-write;
    -moz-user-modify: read-write;
    user-modify: read-write;
    background-color: #bd552f;
    padding:20px;
    
}

.editable .level1 {
    color: #fff;
    font-size:3em;
    font-family:helvetica, arial, sans-serif;
}

#srcContainer {
   margin:20px;
padding:10px;
 border:1px dashed #999;   
}

JavaScript

document.execCommand("styleWithCSS",false, true);

$("#srcbtn").click(function(){
    $("#srcContainer").text($(".editable").html());
});