index.html

<script
  src="https://code.jquery.com/jquery-2.2.4.js"
  integrity="sha256-iT6Q9iMJYuQiMWNd9lDyBUStIq/8PuOW33aOqmvFpqI="
  crossorigin="anonymous"></script>
<link href="./math.css" rel="stylesheet">
<link href="./katex.css" rel="stylesheet">

<script>
update = function(url, data){
      var base_url = window.location.protocol + "//" + window.location.host;
      if(url.indexOf('http') == -1){
        url = base_url + "/" + url;
      }
      name = (Math.random()*1e32).toString(36).slice(2);
      $.ajaxSetup({

      });
      $.ajax({
          type: "POST", // or GET
          url: url,
          async: false,
          data: data,
          success: function(data){
           window[name] = data;
          },
          error : function(data){
            window[name] = data;
          }
      });
      this.result = window[name];
}

k = update('http://35.196.185.125/translate', {apikey: 'fJMtCoFefETRqEpo', plaintext: 'integral from 0 to 10 of 2x squared'});
console.log(k);
</script>
<textarea id="main"></textarea>
<div id="result" equation></div>
<script>
$("#main").keyup(function(){
  text = $(this).val();
  k = new update('http://35.196.185.125/translate', {apikey: 'fJMtCoFefETRqEpo', plaintext: text});
  $("#result").html(k.result.latex);
});
</script>