JSFiddle - React, Tailwind, and code Playground

by Norlihazmey Ghazali

HTML

<table>
    <tbody id="items">
        <tr>
            <td>No.</td>
            <td>name</td>
            <td>price</td>
            <td>addr</td>
            <td>des</td>
            <td>viewed</td>
            <td>status</td>
        </tr>
    </tbody>
</table>

JavaScript

var data = [{
    "name": "dfasdfas",
        "price": "0",
        "addr": "dfasdfas",
        "des": "sadfdfasdfasdf",
        "viewed": "0",
        "img": "",
        "status": "1"
}, {
    "name": "asdDasdA",
        "price": "0",
        "addr": "asdADasd",
        "des": "ASDasdASD",
        "viewed": "0",
        "img": "",
        "status": "1"
}];

var output;
$.each(data, function (i, val) {
    output += '<tr><td>' + i + '</td>' +
        '<td><a><div id="name">' + val.name + '</div> </a></td>' +
        '<td><a><div id="price">' + val.price + '</div> </a></td>' +
        '<td><a><div id"addr">'+ val.addr +'</div></a></td>' +
        '<td><div id="des">' + val.des + '</div> </td>' +
        '<td><a><div id="viewed">' + val.viewed + '</div></a></td>' +
        '<td><a><div id="status">'+
    val.status+'</div></a></td></tr>';
});

$('#items').append(output);