JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
<link rel="stylesheet" href="https://cdn.datatables.net/1.10.13/css/jquery.dataTables.min.css">
<script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
<script src="https://cdn.datatables.net/1.10.13/js/jquery.dataTables.min.js"></script>
<table id="thetable">
    <thead>
        <tr>
            <th> First name</th>
            <th> Last name</th>
            <th> Weight </th>
            <th> Heifgt</th>
        </tr>
    </thead>
    <thead>
        <tr>
            <th> First name</th>
            <th> Last name</th>
            <th> Weight </th>
            <th> Heifgt</th>
        </tr>
    </thead>
    <tbody>
        <tr id="4">
            <td>John</td>
            <td>May</td>
            <td>75kg </td>
            <td> 180cm </td>
        </tr>
        <tr id="2">
            <td>David</td>
            <td>James</td>
            <td>86kg </td>
            <td> 178cm </td>
        </tr>
        <tr id="3">
            <td>paul</td>
            <td>Davidson</td>
            <td>68kg </td>
            <td> 168cm </td>
        </tr>
        <tr id="1">
            <td>Manuel</td>
            <td>Jhonson</td>
            <td>93kg </td>
            <td> 189cm </td>
        </tr>
    </tbody>
</table>

JavaScript

$('#thetable').dataTable({

        });