JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="https://cdn.datatables.net/1.10.12/css/jquery.dataTables.min.css">
<script src="//code.jquery.com/jquery-1.12.3.js"></script>
<script src="https://cdn.datatables.net/1.10.12/js/jquery.dataTables.min.js"></script>
<script src="https://cdn.datatables.net/colreorder/1.3.2/js/dataTables.colReorder.min.js"></script>
<link rel="stylesheet" href="https://cdn.datatables.net/colreorder/1.3.2/css/colReorder.dataTables.min.css">
<table id="example" class="display" cellspacing="0" width="100%">
        <thead>
            <tr>
                <th class="status">A</th>
                <th class="status">B</th>
                <th class="status">C</th>
                <th class="status">D</th>
                <th class="status">E</th>
                <th class="status">F</th>
            </tr>
        </thead>
        <tbody>
            <tr>
                <td>3</td>
                <td>4</td>
                <td>6</td>
                <td>1</td>
                <td>2</td>
                <td>5</td>
            </tr>
            <tr><td>12</td>
                <td>14</td>
                <td>10</td>
                <td>18</td>
                <td>16</td>
               <td>20</td>
            </tr>
            <tr>
                <td>12</td>
                <td>123</td>
                <td>543</td>
                <td>2</td>                
                <td>321</td>
                <td>124</td>
            </tr>
        </tbody>
    </table>
    <div class="console">
    
    </div>

CSS

.console {
  background:#000;
  width:60%;
  padding:20px;
  height:200px; 
  color:#fff;
  overflow-x:scroll
}

JavaScript

var table = $('#example').DataTable({
	colReorder: true
});

table.on('click', 'td:nth-of-type(2)', function() {
	var values = [];
  var row = $(this).parent();
  
  row.children('td').each(function(){
  	values.push(this.innerHTML);
  });

  //remove logs :)
	log("initial values: " + values)
	log("sorted values: " + sortWithIndeces(values));
	log("new column order: " + values.sortIndices);

	var colOrder = values.sortIndices;
	table.colReorder.order(colOrder);

});

//get index after sort
//credit to:
//http://stackoverflow.com/questions/3730510/javascript-sort-array-and-return-an-array-of-indicies-that-indicates-the-positi
function sortWithIndeces(toSort) {
  for (var i = 0; i < toSort.length; i++) {
    toSort[i] = [toSort[i], i];
  }
  toSort.sort(function(a, b) {
    return a[0] - b[0]
  });
  toSort.sortIndices = [];
  for (var j = 0; j < toSort.length; j++) {
    toSort.sortIndices.push(toSort[j][1]);
    toSort[j] = toSort[j][0];
  }
  return toSort;
}

//throwaway :)
function log(s) {
	$('.console').append(s+"<br/>");
}