JSFiddle - React, Tailwind, and code Playground

by gabrieleromanato

HTML

<ul id="test">
            <li>A</li>
            <li>B</li>
            <li>C</li>
            <li>D</li>
            <li>E</li>
            <li>F</li>
</ul>

<button id="shuffle">Shuffle</button>

JavaScript

(function($) {
    
    $.fn.shuffleChildren = function() {
            $.each(this.get(), function(index, el) {
                var $el = $(el);
                var $find = $el.children();
        
                $find.sort(function() {
                    return 0.5 - Math.random();
                });
        
                $el.empty();
                $find.appendTo($el);
            });
    };
    
})(jQuery);


$(function() {
    
    $('#shuffle').click(function() {
            
           
            $('#test').shuffleChildren();
        
    });
    
});