是否可以从两个不同的div中的两个不同的表中对td元素进行排序

Question

我正在创建一个由两个不同table中的两个不同div元素组成的用户界面。现在我有一个要求，这意味着我可以将一个td元素从一个table移动到另一个td元素，或者它们都可以排序。有可能吗？如果是，那么我可以使用哪种插件或方法？

这是代码：

<div id="cool" draggable="true">
  <table>
    <tbody>
      <tr>
        <th></th>
        <th>1</th>
        <th>2</th>
        <th>3</th>
        <th>4</th>
        <th>lunch</th>
        <th>5</th>
        <th>6</th>
        <th>7</th>
        <th>8</th>
      </tr>
      <tr class="sortable list">
        <td draggable="true" style="background-color:green">monday</td>
        <td draggable="true" style="background-color:red">eng</td>
        <td draggable="true" style="background-color:blue">hindi</td>
        <td draggable="true" style="background-color:yellow">maths</td>
        <td draggable="true" style="background-color:red">eng</td>
        <td draggable="true" style="background-color:blue">hindi</td>
        <td draggable="true" style="background-color:yellow">maths</td>
        <td draggable="true" style="background-color:red">eng</td>
        <td draggable="true" style="background-color:blue">hindi</td>
        <td draggable="true" style="background-color:yellow">maths</td>
      </tr>
    </tbody>
  </table>
</div>

，第二个div是

<div id="fool">
  <table>
    <tr>
      <td draggable="true" style="background-color:blue">english</td>
    </tr>
    <tr>
      <td draggable="true" style="background-color:yellow">hindi</td>
    </tr>
    <tr>
      <td draggable="true" style="background-color:green">maths</td>
    </tr>
    <tr>
      <td draggable="true" style="background-color:white">physics</td>
    </tr>
  </table>
</div>