JSFiddle - React, Tailwind, and code Playground

HTML

<form name="form1">
    <input type="button" onClick="Table();" value="Create Table">
</form>
<div id="div1"></div>

JavaScript

function Table() {
    var name = ["Tom", "Tim", "Amy"];
    var age = ["24", "18", "21"];
    var degree = ["Art", "Science", "Engineering"];
    var columns = ["Name", "Age", "Degree"];

    var tab = document.createElement("table");
    document.getElementById("div1").appendChild(tab);
    tab.setAttribute("border", "1");

    // Create thead
    var thd = document.createElement("thead");
    tab.appendChild(thd);
    
    var tr = document.createElement("tr"); 
    thd.appendChild(tr);
    
    for (var i = 0; i < columns.length; i++) {
        var th = document.createElement("th");
        th.appendChild(document.createTextNode(columns[i]));
        tr.appendChild(th);    
    }
    
    var tbdy = document.createElement("tbody");
    tab.appendChild(tbdy);

    for (var j = 0; j < name.length; j++) {
        var tr = document.createElement("tr");
        tbdy.appendChild(tr);

        var td = document.createElement("td");
        td.appendChild(document.createTextNode(name[j]));
        tr.appendChild(td);

        var td1 = document.createElement("td");
        td1.appendChild(document.createTextNode(age[j]));
        tr.appendChild(td1);

        var td2 = document.createElement("td");
        td2.appendChild(document.createTextNode(degree[j]));
        tr.appendChild(td2);
    }
}