<table id="example" class="display table table-striped table-bordered" cellspacing="0" width="100%">
    <thead>
        <tr>
            <th>ID</th>
            <th>Product Name</th>
            <th>Category</th>
            <th>Price</th>
            <th>Quantity</th>
            <th>Date Created</th>
            <th>Status</th>
            <th class="ecomm-action-icon">Action</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td>25</td>
            <td>Product abc</td>
            <td>Clothes</td>
            <td>$320,800</td>
            <td>236</td>
            <td>2011/07/25</td>
            <td>
                <span class="label label-info label-wide">Published</span>
            </td>
            <td>
                <button type="button" class="btn btn-info btn-xs btn-labeled next-btn">Edit<span class="btn-label btn-label-right"><i class="fa fa-pencil"></i></span></button>
            </td>
        </tr>
        ...
    </tbody>
    <tfoot>
        <tr>
            <th>ID</th>
            <th>Product Name</th>
            <th>Category</th>
            <th>Price</th>
            <th>Quantity</th>
            <th>Date Created</th>
            <th>Status</th>
            <th class="ecomm-action-icon">Action</th>
        </tr>
    </tfoot>
</table>
<!-- ========== JS ========== -->
<script>
    $(function($) {
        $('#example').DataTable();
    });
</script>