JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">
<script src="https://cdn.datatables.net/1.10.5/js/jquery.dataTables.min.js"></script>
<table class="table datatable_tri" Style="width: 100%">
    <thead> <tr>  <th>N</th> <th>Size</th> </tr> </thead>
    <tbody>
        <tr> 
            <td>1</td> 
            <td>2 Go</td> </tr> 
        <tr>
            <td>2</td>
            <td>1 To</td>
        </tr>
        <tr>
            <td>3</td>
            <td>2 To</td>
        </tr>
         <tr>
            <td>4</td>
            <td>1 Go</td>
        </tr> 
    </tbody>
</table>
----------------------------------------------------------
<table class="table datatable_tri" Style="width: 100%">
    <thead> <tr>  <th>Size</th> <th>N°</th> </tr> </thead>
    <tbody>
        <tr>  
            <td>2 Go</td> 
            <td>1</td></tr> 
        <tr>
             <td>1 To</td>
            <td>2</td>
        </tr>
        <tr>
            <td>2 To</td>
            <td>3</td>
        </tr>
         <tr>
             <td>1 Go</td>
            <td>4</td>
        </tr> 
    </tbody>
</table>

JavaScript

jQuery.extend(jQuery.fn.dataTableExt.oSort, {
    "file-size-pre": function (a) {
        var x = a.substring(0, a.length - 2);
        var x_unit = (a.substring(a.length - 2, a.length) == "Go" ? 1000 : (a.substring(a.length - 2, a.length) == "To" ? 1000000 : 1));
        return parseInt(x * x_unit, 10);
    },
        "file-size-asc": function (a, b) { return ((a < b) ? -1 : ((a > b) ? 1 : 0)); },
        "file-size-desc": function (a, b) { return ((a < b) ? 1 : ((a > b) ? -1 : 0)); }
});

$(document).ready(function () {
    $('.datatable_tri').dataTable({
        'columnDefs': [{ 'type': 'file-size', 'title' : 'Size' }],
            'aaSorting': [],
            'iDisplayLength': 50
    });
});