JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="//cdn.datatables.net/1.10.19/css/jquery.dataTables.min.css">
<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
<script src="//cdn.datatables.net/1.10.19/js/jquery.dataTables.min.js"></script>
<script src="https://cdn.datatables.net/colreorder/1.5.1/js/dataTables.colReorder.js"></script>
<table>
<thead>
  <tr>
    <td>A</td>
    <td>B</td>
    <td>C</td>
  </tr>
</thead>
<body>
<tr>
  <td>1a</td>
  <td>1b</td>
  <td>1c</td>
</tr>
<tr>
  <td>2a</td>
  <td>2b</td>
  <td>2c</td>
</tr>
<tr>
  <td>3a</td>
  <td>3b</td>
  <td>3c</td>
</tr>
</body>
</table>
<input type="checkbox" id="chk" /><label for="chk">Reset First</label>
<button type="button">ABC</button>
<button type="button">CBA</button>
<button type="button">BAC</button>

JavaScript

$( function () {
    $('table').DataTable({
    	colReorder: true
    });
    $('button').on('click', function() {
    	var dt = $('table').DataTable(),
      		seq = {
          ABC: [0,1,2],
          CBA: [2,1,0],
          BAC: [1,0,2]
          };
      if($('#chk').is(':checked'))
      	dt.colReorder.reset();
      dt.colReorder.order(seq[$(this).text()]);
    })
} );