JSFiddle - React, Tailwind, and code Playground

by Vikram Deshmukh

HTML

<div id="target">
    <table cellspacing='0' cellpadding='0' border='1'>
        <thead>
            <tr>
                <th>Id</th>
                <th>Name</th>
            </tr>
        </thead>
        <tbody></tbody>
    </table>
</div>

CSS

table {
    border:1px solid #000;
    width:100%;
}
th, td {
    padding:10px;
}

JavaScript

var items = [
        {name:"Alexander"},
        {name:"Barklay"},
        {name:"Chester"},
        {name:"Domingo"},
        {name:"Edward"},
        {name:"..."},
        {name:"Yolando"},
        {name:"Zachary"}
    ];

$(document).ready(function(){
    $.each( items, function( i, val ) {
        $("#target table tbody").append("<tr><td>"+i+"</td><td class='"+val["name"]+"'>"+val["name"]+"</td></tr>");
    });
});