JSFiddle - React, Tailwind, and code Playground
HTML
<ul id="sortable1" class="connectedSortable">
first
<li>One</li>
<li>Two</li>
<li>Three</li>
</ul>
<ul id="sortable2" class="connectedSortable">
sec
<li>Four</li>
<li>Five</li>
<li>Six</li>
</ul>
<ul id="sortable3" class="connectedSortable">
thd
<li>Seven</li>
<li>eight</li>
<li>Nine</li>
</ul>
CSS
.connectedSortable{
border: 1px solid red
}
JavaScript
jQuery(function() {
jQuery( "#sortable1, #sortable2, #sortable3" ).sortable({
connectWith: ".connectedSortable"
}).disableSelection();
jQuery( ".connectedSortable" ).sortable();
});