JSFiddle - React, Tailwind, and code Playground

HTML

<html>
   <head>
   </head>
   <body>
      <div class="wrapper">
         <div class="profile">
            <table id= "userdata" border="2">
               <thead>
                  <th>Organization</th>
                  <th>URL</th>
                  <th>Account</th>
                  <th>Created</th>
               </thead>
               <tbody>
               </tbody>
            </table>
         </div>
      </div>
            <script>
         (function() {

         var table = document.getElementById("userdata"); 

         var people = [];
        var xhttp = new XMLHttpRequest();
           xhttp.onreadystatechange = function() {
             if (this.readyState == 4 && this.status == 200) {
              var res = JSON.parse(this.responseText);
              console.log(res.results);
               res.results.map(f=>{
              var tblRow = "<tr>" + "<td>" + f.account + "</td>" +
                                    "<td>" + f.service_url + "</td>" + "<td>" + f.created_at + "</td>" + "<td>" + f.id + "</td>" + "</tr>"
                                    table.innerHTML += tblRow;
              }); 
             }
           };
           xhttp.open("GET", "https://api.gsa.gov/systems/digital-registry/v1/social_media.json", true);
           xhttp.send(); 
                    })();
         </script>
   </body>
</html>