JSFiddle - React, Tailwind, and code Playground

HTML

<p><script>source();</script></p>
<textarea>Text v inputu</textarea>

CSS

body {
    font-family: Georgia;
    color: #444;
    background: #eee;
    margin: 20px;
}

h1 { font-weight: bold; color: #069; margin-bottom: 1em; }

h2,h3,h4,h5,h6,h7,h8 {
    margin: 0;
    padding: 0;
    font-size: 1em;
    font-weight: normal;
}

h2 {
    margin-top: .5em;
    font-weight:bold;
}

h3 { margin-left: 1em; color: #066; }
h4 { margin-left: 2em; color: #606; }
h5 { margin-left: 3em; color: #660; }
h6 { margin-left: 4em; color: #666; }

textarea {
    font-size: 9px;
    float: left;
    width: 45%;
    margin-right: 1em;
}    

#toc {
    width: 45%;
    float: left;
    background: #ddd;
    min-height: 200px;
    border: 3px solid #fff;
    padding: 1em;
}


#submit {
    font-size: 2em;
    border: 2px solid #888;
    padding: .5em;
    display: block;
}

JavaScript

// selector for the source textarea
var source = $('textarea');