JSFiddle - React, Tailwind, and code Playground

HTML

<h3>Test</h3>
<p>Testing, testing!

CSS

head {
    display: block;
    border-bottom: 5px solid red; 
}
script, style, link {
    display: block;
    white-space: pre;
    font-family: monospace;
}
script:before {
    content: "<script src=\"" attr(src) "\" type=\"" attr(type) "\">"; 
}
script:after {
    content: "</script>";
}

style:before {
    content: "<style type=\"" attr(type) "\">"; 
}
style:after {
    content: "< /style>";
}

/* And for a finish, <link> */
link:before {
    content: "<link rel=\"" attr(rel) "\" type=\"" attr(type) "\" href=\"" attr(href) "\" />";
}

JavaScript

var arr = [1,2,3,4];
arr.map(function(x) {
    return x * 2;
});
var p = document.createElement('p');
p.innerHTML = arr.join(", ");
document.body.appendChild(p);