JQuery переместить элемент списка до конца списка

У меня есть этот список, который можно сортировать с помощью сортировки. Как я могу переместить элемент li с классом .neutral в конец списка при завершении сортировки?

$(".thumbs").sortable({
    stop: function(event, ui) { 
        // move .neutral at the end of this list
    }
});

<ul class="thumbs">
    <li>red</li>
    <li>green</li>
    <li class="neutral">none</li>
    <li>yellow</li>
    <li>blue</li>
<ul>

Ответ 1

Вы можете добавить (переместить) их в конец списка с помощью .appendTo(), например:

$(".thumbs").sortable({
    stop: function(event, ui) {
      $(this).find('.neutral').appendTo(this);
    }
});

Здесь вы можете попробовать здесь, он получает все элементы .neutral внутри и присоединяет их к this, который является ul.thumbs В настоящее время мы работаем для нескольких независимых списков эскизов.

Ответ 2

Эквивалент будет следующим:

$(".neutral").appendTo(".thumbs");
OR
$(".thumbs").append(".neutral");

Вы можете перемещать элемент вокруг страницы, выбирая его и добавляя или добавляя его в другое место.

NB: будьте осторожны с областью действия - если вы используете классы, и этот пользовательский интерфейс появляется несколько раз на странице, эти сегменты должны быть привязаны к текущему экземпляру с использованием параметра ui, переданного в функцию остановки.