JSFiddle - React, Tailwind, and code Playground

HTML

<div class="container">
<div class="yellow"></div>
<div class="red"></div>
<div class="green"></div>
<div class="blue"></div>
<div class="pink"></div>
<div class="orange"></div>
<div class="black"></div>
<div class="white"></div>
</div>

CSS

div.container div{
    width:50px;
    height:50px;
    border:2px solid #000000;
}

JavaScript

(function($) {

$.fn.randomize = function(childElem) {
  return this.each(function() {
      var $this = $(this);
      var elems = $this.children(childElem);
      
      elems.sort(function() { return (Math.round(Math.random())-0.5); });  

      $this.empty();  

      for(var i=0; i < elems.length; i++)
        $this.append(elems[i]);      

  });    
}
})(jQuery);
$("div.container div").each(function(){
    var color = $(this).attr("class");
    $(this).css({backgroundColor: color});
    $(this).addCass("member");
});
window.setTimeout(function(){
    $("div.container").randomize("div.member");
}, 3000);