JSFiddle - React, Tailwind, and code Playground

HTML

<table id="example" class="table table-bordered table-striped tbl-warehouse
                                    ">
            <thead>
                <tr>
                   <th>Sl No.</th>
				   <th>Code</th>
				   <th>Address</th>
				   <th>NUMBER OF STORES</th>
				   <th>CAPACITY</th>
				 
				   
                </tr>
            </thead>
            <tbody>
             
       
               
            </tbody>
            <tfoot>
                <tr>
                   <th>Sl No.</th>
				   <th>Code</th>
				   <th>Address</th>
				   <th>NUMBER OF STORES</th>
				   <th>CAPACITY</th>
				   
				   
                </tr>
            </tfoot>
        </table>

JavaScript

function loadAllWarehouse() {
    var getallWarehouse = JSON.stringify('ggg');
    $.ajax({
        url: "loadWarehouse",
        type: "POST",
        cache: false,
        data: {
            loadByUserId: getallWarehouse
        },
        dataType: "json",
        success: function (jsnResponse) {
            console.log(jsnResponse);
            if (jsnResponse.status) {
                $('.tbl-warehouse tbody tr').remove();
                var warehouseList = jsnResponse.warehouseList;
                console.log(warehouseList);
                    for (i = 0; i < warehouseList.length; i++) {

                        var lst = '<tr warehouseId=' + warehouseList[i].warehouseId + '><td>' + (i + 1) + '</td><td>' +
                            warehouseList[i].code + '</td><td>' + warehouseList[i].address + '</td><td>' + warehouseList[i].no_of_stores + '</td><td>' + warehouseList[i].capacity +
                            '</td></tr>';

                        $('.tbl-warehouse tbody').append(lst);
                        
                        console.log(lst)
                    }
            } 
        },
        error: function (err) {
            console.log("error occured");
        }
    });
}