JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.8.3/underscore-min.js"></script>
<script type="text/html" id='usageList'>
<table cellspacing='0' cellpadding='0' border='1' >
        <thead>
            <tr>
                <th>Id</th>
                <th>Name</th>
            </tr>
        </thead>
        <tbody>

        <% _.each(items,function(item,key,list){ %>
        <% var f = item.name; %><!-- create more variables -->
            <tr>
                <!-- use variables -->
                <td><%= key %></td>
                <td class="<%= f %>"><%= item.name %></td>
            </tr>
        <% }); %>
    </tbody>
</table>
</script>

<!-- Create your target -->
<div id="target"></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"}
    ];
 
var template = $("#usageList").html();
$("#target").html(_.template(template,{items:items}));