JSFiddle - React, Tailwind, and code Playground

by Alvin Olavarrieta

HTML

<table border="1px">
    <tr>
        <th>id</th>
        <th>city_id</th>
        <th>temp</th>
        <th>date</th>
    </tr>
</table>

JavaScript

//Table Columns - append date to table.
var data = [
    {id: '0', city_id:'100', temperature:'+20', date:'2011-09-23'},
    {id: '0', city_id:'100', temperature:'+20', date:'2011-09-23'},
    {id: '0', city_id:'100', temperature:'+20', date:'2011-09-23'},
    {id: '0', city_id:'100', temperature:'+20', date:'2011-09-23'},
    {id: '0', city_id:'100', temperature:'+20', date:'2011-09-23'},
    {id: '0', city_id:'100', temperature:'+20', date:'2011-09-23'},
    {id: '0', city_id:'100', temperature:'+20', date:'2011-09-23'},
    {id: '0', city_id:'100', temperature:'+20', date:'2011-09-23'},
    {id: '0', city_id:'100', temperature:'+20', date:'2011-09-23'},
    {id: '0', city_id:'100', temperature:'+20', date:'2011-09-23'},
    {id: '0', city_id:'100', temperature:'+20', date:'2011-09-23'},
    {id: '0', city_id:'100', temperature:'+20', date:'2011-09-23'}
];

$('table tr:gt(0)').remove();

var html = "";
$(data).each(function() {
    html += "<tr>"+
                "<td>"+this.id+"</td>"+
                "<td>"+this.city_id+"</td>"+
                "<td>"+this.temperature+"</td>"+
                "<td>"+this.date+"</td>"+
            "</tr>";    
});


$('table').append(html);