JSFiddle - React, Tailwind, and code Playground

by mauricederegt

HTML

<div id="a2"></div>

JavaScript

var Menu = function(data) {
    this.data = data;
};

var classes = ['a', 'b', 'c', 'd', 'e', 'f', 'g', 'h', 'i', 'j', 'k'];
//var classes = ['a', 'd', 'f'];
var sourceClasses = [];
var totalCount = 66;
var selectedClasses = [];
var itemCount = 0;
var f = 0;
var bR = 0;

Menu.prototype.render = function() {
    // Get total item count between all arrays
    var floors = $("<ul />");
    var r = 0;
    
    $.each(this.data, function(i, e) {
        var tempRow = $("<li />");
        var c = 0;
       
        $.each(e, function(k, g) {    
        // If we have no more classes left we re-set the list of items to the original source
        // SourceClasses.length will off course not be 0 ever if we already passed the half-way mark.
        if(sourceClasses.length === 0){
          for(index = 0; index < classes.length; index++){
            sourceClasses.push(classes[index]);
          }
        }  
        var randomClass;
  
        randomClass = Math.round(Math.random() * (sourceClasses.length - 1) + 0);
        var selectedClass = sourceClasses[randomClass];
        
            tempRow.append($("<a></a>", {
                class: selectedClass,
                'data-i': bR++,
                'data-t': selectedClass,
                'data-f': f,
                'data-r': r,
                'data-c': c++,
                style: g.style
                
            }));
            
            sourceClasses.splice(sourceClasses.indexOf(selectedClass), 1);
            selectedClasses.push(selectedClass);
            itemCount += 1;
            
                   
            
                        if (totalCount % 2 != 0) {
                            if (itemCount === (totalCount - 1) / 2) {
                                sourceClasses = selectedClasses;
                                var additionalClass = Math.round(Math.random() * (sourceClasses.length - 1) + 0);
                                sourceClasses.push(sourceClasses[additionalClass]);
       ...