JSFiddle - React, Tailwind, and code Playground

HTML

<link href="http://code.jquery.com/ui/jquery-ui-git.css" rel="stylesheet">
<script src="http://code.jquery.com/jquery-git.js"></script>
<script src="http://code.jquery.com/ui/jquery-ui-git.js"></script>
    
<table>
  <tbody class="sort">
    <tr>
      <td style="text-align: left; width: 31px">o</td>
      <td>Freehand</td>
      <td>Empty</td>
      <td style="text-align: right; width: 52px">o o o</td>
    </tr>
    <tr>
      <td style="text-align: left; width: 31px">o</td>
      <td>Freehand</td>
      <td>Empty</td>
      <td style="text-align: right; width: 52px">o o o</td>
    </tr>
    <tr>
      <td style="text-align: left; width: 31px">o</td>
      <td>Freehand</td>
      <td>Empty</td>
      <td style="text-align: right; width: 52px">o o o</td>
    </tr>
    <tr>
      <td style="text-align: left; width: 31px">o</td>
      <td>Freehand</td>
      <td>Empty</td>
      <td style="text-align: right; width: 52px">o o o</td>
    </tr>
  </tbody>
</table>

CSS

table {
    width: 100%;
    border: 1px solid red;
    table-layout: fixed;
}

JavaScript

$(".sort").sortable();