JSFiddle - React, Tailwind, and code Playground

HTML

<html>
    <head>
    <title>MathJax Dynamic Math Test Page</title>

    <script type="text/x-mathjax-config">
      MathJax.Hub.Config({
        tex2jax: {
          inlineMath: [["$","$"],["\\(","\\)"]]
        }
      });
    </script>
    <script type="text/javascript"
      src="http://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS_HTML-full">
    </script>

    </head>
    <body>

 
    <textarea  id="MathInput" size="50" onkeyup="UpdateMath(this.value)"></textarea>
   <div>You typed:
    <div id="MathOutput">
 
    </div>
        </div>

    </body>
    </html>

JavaScript

//
//  Use a closure to hide the local variables from the
//  global namespace
//
(function () {

//
//  The onchange event handler that typesets the
//  math entered by the user
//
window.UpdateMath = function (TeX) {
    //set the MathOutput HTML
    document.getElementById("MathOutput").innerHTML = TeX;
    //reprocess the MathOutput Element
    MathJax.Hub.Queue(["Typeset",MathJax.Hub,"MathOutput"]);
 
}
})();