JSFiddle - React, Tailwind, and code Playground
by karlovac
HTML
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
<table class="table table-striped" id="browsers">
<thead>
<tr>
<td>OS</td>
<td>Browser</td>
<td>Current Version</td>
<td>Fluid Supports</td>
</tr>
</thead>
<tbody>
</tbody>
</table>
JavaScript
var url = 'http://www.webvakman.nl/api/recentbrowserversions';
$(function() {
$.getJSON( url, function( data ) {
$.each( data.BrowserList, function( os, browsers ) {
console.log('each');
console.log(os, browsers);
for (var browserName in browsers) {
var details = browsers[browserName];
if (details === null) {
continue;
}
var cells = [];
cells.push('<td>'+os+'</td>');
cells.push('<td>'+browserName+'</td>');
cells.push('<td>'+details.LatestVersion+'</td>');
cells.push('<td>'+(details.LatestVersion-1)+'</td>');
var row = $("<tr></tr>").append(cells.join(''));
console.log(row);
row.appendTo( "#browsers tbody" );
}
//items.push( "<li id='" + key + "'>" + val + "</li>" );
});
});
});