JSFiddle - React, Tailwind, and code Playground

by taylorbuley

HTML

<div id="results"></div>

JavaScript

function escape( text ) {
                if( 'string' === typeof text ) {
                        text = text.replace( /&/gm, '&amp;' );
                        text = text.replace( /</gm, '&lt;' );
                        text = text.replace( />/gm, '&gt;' );
                        text = text.replace( /"/gm, '&quot;' );
                        text = text.replace( /'/gm, '&#39;' );
                        return text;
                } else if( 'boolean' == typeof text || 'number' == typeof text ) {
                        return text;
                } else {
                        return;
                }   
}
function unescape( text ) {
                if( 'string' === typeof text ) {
                        text = text.replace( /&amp;/gm, '&' );
                        text = text.replace( /&lt;/gm, '<' );
                        text = text.replace( /&gt;/gm, '>' );
                        text = text.replace( /&quot;/gm, '"' );
                        text = text.replace( /&#39;/gm, "'" );
                        return text;
                } else if( 'boolean' == typeof text || 'number' == typeof text ) {
                        return text;
                } else {
                        return;
                }   
}


var text = JSON.stringify( [ { 'rank': 1 }, {'rank': 2 } ] );
    var test_result = escape( text  );
console.log("GOOD?", JSON.parse( unescape( test_result ) ) );
// Append to DOM
var text = document.createTextNode( test_result);
var frag = document.createDocumentFragment();
frag.innerHTML = test_result;
var doc = document.getElementById( 'results' );
frag.appendChild( text );
doc.appendChild( frag );