JSFiddle - React, Tailwind, and code Playground

by Carlos Medina

HTML

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="https://cdn.datatables.net/1.10.10/js/jquery.dataTables.min.js"></script>
<script src="https://cdn.datatables.net/select/1.1.2/js/dataTables.select.min.js"></script>
<link rel="stylesheet" href="https://cdn.datatables.net/select/1.1.2/css/select.dataTables.min.css">
<link rel="stylesheet" href="https://cdn.datatables.net/1.10.11/css/jquery.dataTables.min.css">
<table id="example" class="display DataTable" cellspacing="0" width="100%">
        <thead>
            <tr><th>Years</th></tr>
        </thead>

        <tbody>
            <tr><td data-order="10">10 - years</td></tr>
            <tr><td data-order="10">10 - years</td></tr>
            <tr><td data-order="5">5 - years</td></tr>
            <tr><td data-order="4">4 - years</td></tr>
        </tbody>
    </table>

JavaScript

$(document).ready(function() {
    $('#example').DataTable({
    		"order": [ 0, 'asc' ]
    });
} );