JSFiddle - React, Tailwind, and code Playground

HTML

<body>
<div class="table-view" id="gist-list"></div>
</body>

CSS

.table-view {
    width:100%;
    height:100%;
    overflow:scroll;
}
.table-view-cell{
    width:100%;
    height:30px;
    border: 1px solid #c0c0c0;
    cursor: pointer;
}
.table-view-cell::after{
    clear:both;
}
.table-view-cell .title{
    padding-left:10px;
    line-height:30px;
}
.table-view-cell .count{
    float:right;
    background-color:gray;
    color:white;
    font-weight: bold;
    width:40px;
    height:100%;
    text-align:center;
    line-height:30px;

JavaScript

$.tableView = function (tableId) {
    var o = {
        table: $(tableId),
        items: [],
        
        setItems: function (objs) {
            o.items = objs;
            return o;
        },
        reloadData: function () {
            o.table.empty();
            o.render();
            return o;
        },
        render: function () {
            var my=o;
            $.each(o.items, function (index, value) {
                my.table.append($.tableViewCell(value).render());
            });
        }
    };
    return o;
};

$.tableViewCell = function(obj){
    var o = {
        title: Object.keys(obj.files)[0],
        count: obj.comments,
        id: obj.id,
        cell: $("<div class='table-view-cell'></div>"),
        
        onTitleClick: function(){
            alert(o.title);
        },
        onCountClick: function(){
            o.cell.children(".count").empty();
            $.getJSON('https://api.github.com/gists/'+o.id,
            function (data) {
               o.count=data.comments;
               o.cell.children(".count").text(o.count);
            });
        },
        render: function(){
            o.cell.empty();
            o.cell.append("<span class='title'>"+o.title+"</span>"+
                             "<span class='count'>"+o.count+"</span>");
            o.cell.children(".count").on('click', this.onCountClick );
            o.cell.children(".title").on('click', this.onTitleClick );
            return o.cell;
        }
    };
    return o;
};

$(document).ready(function () {
    $.getJSON('https://api.github.com/users/honcheng/gists',
    function (data) {
        $.tableView('#gist-list').setItems(data).reloadData();
    });
    
});