JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/jquery-ui.min.js"></script>
<ul>
    <li>A</li>
    <li>B</li>
    <li>C</li>
    <li class="disabled">X1</li>
</ul>

JavaScript

$(function() {
    var index;
    $("ul").sortable({
        start: function(event, ui){
            index = $(event.target).index();
        },
        cancel: ".disabled",
        change: function(event, ui) {
            if (ui.helper.prev().hasClass("disabled")) {
                $("ul").children().eq(index+1).before(ui.helper.prev());
            }
            if (ui.placeholder.prev().hasClass("disabled")) {
                $("ul").children().eq(index+1).before(ui.placeholder.prev());
            }
        }
    });
});