JSFiddle - React, Tailwind, and code Playground

HTML

<div id="container">
    Top Container
    <div id="top_icons">
        <ul id="sortable1" class="connectedSortable">
            <li class="ui-state-default">onegfghfghfghfghfghfghfghfghfghfghfghfgh</li>
            <li class="ui-state-default">two</li>
            <li class="ui-state-default">three</li>
            <li class="ui-state-default">four</li>
            <li class="ui-state-default">five</li>
            <li class="ui-state-default">six</li>
            <li class="ui-state-default">seven</li>
            <li class="ui-state-default">eight</li>
        </ul>
    </div>
    Bottom Container
    <div id="bot_icons">
        <ul id="sortable2" class="connectedSortable">
            <li class="ui-state-default">nine</li>
            <li class="ui-state-default">ten</li>
            <li class="ui-state-default">eleven</li>
            <li class="ui-state-default">twelve</li>
            <li class="ui-state-default">13</li>
        </ul>
    </div>
</div>
<div>=============================================================================</div>
<div id="container">
    <div id="top_icons">Top Container
        <ul id="sortable1" class="connectedSortable">
            <li class="ui-state-default"><a href="" target="_blank">onebvnvbnvbnvbn<br>fghfghfghfghfgh</a></li>
            <li class="ui-state-default"><a href="" target="_blank">two</a></li>
            <li class="ui-state-default"><a href="" target="_blank">three</a></li>
            <li class="ui-state-default"><a href="" target="_blank">four</a></li>
            <li class="ui-state-default"><a href="" target="_blank">five</a></li>
            <li class="ui-state-default"><a href="" target="_blank">six</a></li>
            <li class="ui-state-default"><a href="" target="_blank">seven</a></li>
            <li class="ui-state-default"><a href="" target="_blank">eight</a></li>
        </ul>
    </div>
    <div id="bot_icons">Bottom Container
        <ul id="sortable2" class="connectedSortable">
           ...

CSS

.ui-state-default {
    display: inline-block;
    padding: 10px;
    margin: 0px 0px;
    cursor: pointer;
}
.ui-state-default a:link, a:active, a:visited, a:hover {
    width: 100px;
    height: 50px;
    border: 1px dotted #999; 
    background-color: #f3f3f3; 
    margin:5px;
    display: block;
}

.connectedSortable {
    height: 200px;
    width: 500px;
}

JavaScript

$(function() {
    $("#sortable1, #sortable2").sortable({
        connectWith: ".connectedSortable"
    }).disableSelection();
});