JSFiddle - React, Tailwind, and code Playground

by thillin

HTML

<table border="1" bordercolor="#000" style="background-color:#FFFFCC" width="100%" cellpadding="3" cellspacing="0">
    <tr>
        <td>OS</td>
        <td>Visits</td>
    </tr>
    <tr>
        <td class="os1"></td>
        <td class="osval1">Visits</td>
    </tr>
    <tr>
        <td class="os1"></td>
        <td class="osval1">Visits</td>
    </tr>
    <tr>
        <td class="os2"></td>
        <td class="osval2">Visits</td>
    </tr>
    <tr>
        <td class="os3"></td>
        <td class="osval3">Visits</td>
    </tr>
    <tr>
        <td class="os4"></td>
        <td class="osval4">Visits</td>
    </tr>
    <tr>
        <td class="os5"></td>
        <td class="osval5">Visits</td>
    </tr>
    <tr>
        <td class="os6"></td>
        <td class="osval7">Visits</td>
    </tr>
    <tr>
        <td class="os7"></td>
        <td class="osval8">Visits</td>
    </tr>
    <tr>
        <td class="os9"></td>
        <td class="osval9">Visits</td>
    </tr>
    <tr>
        <td class="os10"></td>
        <td class="osval10">Visits</td>
    </tr>

JavaScript

$.getJSON('https://api.gosquared.com/trends/v2/os?limit=0%2C100&from=2013-10-01+00%3A00%3A00&to=2013-10-31+23%3A59%3A59&site_token=GSN-2194840-F&api_key=M4FU0S5TTB1VVZMX', function (data) {
    var row = 1;

    console.log(data);

    for (var i = 0; i < data.list.length; i++) {
        var os = (data.list[row - 1].id);
        var os_row = ".os" + row;
        console.log(os);
        console.log(os_row);
          if (os == "win/6-1" || os == "mac/10-8") {
        $(os_row).append("Desktop");
         }
        console.log(row);
        row++;
    }
});