JSFiddle - React, Tailwind, and code Playground

by Cristian Trifan

HTML

<script src="//cdn.datatables.net/1.10.0/js/jquery.dataTables.js"></script>
<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css">
<link rel="stylesheet" href="http://cdn.datatables.net/1.10.0/css/jquery.dataTables.css">
<script src="//cdnjs.cloudflare.com/ajax/libs/moment.js/2.6.0/moment.min.js"></script>
<h4 style="margin: 0; padding: 10px; vertical-align: middle;">DataTables Playground</h4>

<hr style="margin: 0px 0 15px 0;">
<div class="main-content">
    <table id="dt" class="table table-condensed table-hover">
        <thead>
            <th>Name</th>
            <th>Description</th>
            <th>Created</th>
        </thead>
    </table>
</div>

CSS

.main-content {
    padding: 5px 10px;
}

JavaScript

jQuery(function ($) {
    $('#dt').DataTable({
        searching: true,
        ordering: true,
        paging: true,
        pagingType: 'full_numbers',

        data: [{
            name: "First",
            description: "First Item",
            created: 1222343423
        }, {
            name: "First",
            description: "First Item",
            created: 1222343423
        }, {
            name: "First",
            description: "First Item",
            created: 1222343423
        }, {
            name: "First",
            description: "First Item",
            created: 1222343423
        }, {
            name: "First",
            description: "First Item",
            created: 1222343423
        }, {
            name: "First",
            description: "First Item",
            created: 1222343423
        }, {
            name: "First",
            description: "First Item",
            created: 1222343423
        }, {
            name: "First",
            description: "First Item",
            created: 1222343423
        }, {
            name: "First",
            description: "First Item",
            created: 1222343423
        }, {
            name: "First",
            description: "First Item",
            created: 1222343423
        }, {
            name: "First",
            description: "First Item",
            created: 1222343423
        }, {
            name: "First",
            description: "First Item",
            created: 1222343423
        }, {
            name: "First",
            description: "First Item",
            created: 1222343423
        }, {
            name: "First",
            description: "First Item",
            created: 1222343423
        }, {
            name: "First",
            description: "First Item",
            created: 1222343423
        }, {
            name: "First",
            description: "First Item",
            created: 1222343423
        }, {
            name: "First",
           ...