title: How to display response on HTML page after an XMLHTTPRequest?
body: <p>I am making my own project. I am sending out an AJAX request which will come back with a response. I want to parse out the response and display the data in a table. Like so:</p>
  
  <pre><code>&lt;head&gt;
  &lt;script&gt;
  var message = null;
  function ajaxCallToServer() {
      var xmlhttp = new XMLHttpRequest(); var url = "something"
      xmlhttp.open("GET", url, true);
      xmlhttp.setRequestHeader("Content-type", "application/json");
      xmlhttp.onload = (res) =&gt; {
          console.log(res['target']['response']);
          message = res['target']['response']; // message is a JSON object
      };
      xmlhttp.send();
  }
  &lt;/script&gt;
  &lt;/head&gt;
  ...
  &lt;body&gt;
      &lt;% if ( message) { %&gt;
      &lt;!--loop through message object to display message on the page--&gt;
      &lt;div class="table"&gt;
          &lt;% for(key in message) { %&gt;
          &lt;% if(message.hasOwnProperty(key)) { %&gt;
          &lt;div class="tr"&gt;
              &lt;div class="td key"&gt;&lt;b&gt;&lt;%= key %&gt;&lt;/b&gt;&lt;/div&gt;
              &lt;div class="td value"&gt;&lt;%= message[key] %&gt;&lt;/div&gt;
          &lt;/div&gt;
          &lt;% } %&gt;
          &lt;% } %&gt;
      &lt;/div&gt;
      &lt;% } %&gt;
  &lt;/body&gt;
  </code></pre>
  
  <p>I am assigning the variable message (which the console.log shows has the correct data) then printing it using ejs later in the page. The ejs does not print the ‘message’ and I suspect it has something to do with needing the page to re-load.. help!</p>