JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
<button class="sort-elements">Сортировать</button>
<div class="title">Обычно</div>
<div class="sorting">
    <ul class="elements">
        <li>Элементы</li>
        <li>Для</li>
        <li>Проверки</li>
        <li>Сортировки</li>
        <li>На</li>
        <li>jQuery</li>
    </ul>
</div>

JavaScript

var reversed = 0;
    //getElementById
    var elem = $('.elements');
    var clone = $(elem).clone(true, true);
    $('.sort-elements').click(function() {
        var $elements = $('.elements li');
        if (reversed == 0) {
            $('.title').text('По возрастанию');
            reversed = 1;
        }
        else if (reversed == 1) {
            $('.title').text('По убыванию');
            reversed = -1;
        } else if (reversed == -1) {
            $('.title').text('Обычно');
            reversed = 0;
        }
        if (reversed != 0) {
            $elements.sort(function (a, b) {
                var num1 = $(a).text();
                var num2 = $(b).text();

                if (reversed == 1) {
                    if (num1 < num2) return 1;
                    else if (num1 > num2) return -1;
                    else return 0;
                }
                else if (reversed == -1) {
                    if (num1 < num2) return -1;
                    else if (num1 > num2) return 1;
                    else return 0;
                }
            });
        } else {
            $elements = $(clone).find('li').clone();
        }
        $('.sorting ul').html($elements);
    });