JSFiddle - React, Tailwind, and code Playground

by Kevin Faulhaber

CSS

div {
    display: block;
    background-color: green;
    margin-bottom: 10px;
}
div ul{
    display: inline-block;
}

JavaScript

var groups = [
	[1, 2, 3, 4],
	[5, 6, 7, 8],
	[9, 10, 11, 12],
	[13, 14, 15, 16],
	[17, 18, 19, 20],
	[21, 22, 23, 24]
];
var errors = {
    1:[],
    2:[],
    3:[],
    4:[],
    5:[],
    6:[],
    7:[],
    8:[],
    9:[],
    10:[],
    11:[],
    12:[],
    13:[],
    14:[],
    15:[],
    16:[],
    17:[],
    18:[],
    19:[],
    20:[],
    21:[],
    22:[],
    23:[],
    24:[]
};
var mediator = [[],[],[],[],[],[]];
function reset()
{
    mediator = [[],[],[],[],[],[]];
}
post();
odd(0);
//number of days here
function even(i)
{
    if(i < 11)
    {
        reset();
        for(var j = 0; j < 6; j++)
        {
            var k = (j+1) % 6;
            while(groups[j].length  > 0)
            {
               mediator[k].push(groups[j].pop());
               k = (k + 1) % 6;
            }
        }
        groups = mediator;
        post();
        findErrors();
        odd(i+1);
    }
}
function odd(i)
{
    if(i < 11)
    {
        reset();
        for(var j = 5; j >= 0; j--)
        {
            var k = (j+1) % 6;
            while(groups[j].length  > 0)
            {
               mediator[k].push(groups[j].shift());
               k = (k + 1) % 6;
            }
        }
        groups = mediator;
        post();
        findErrors();
        even(i+1);
    }
}
function post()
{
    var list = document.createElement('div');
    for(var i = 0; i < groups.length; i++)
    {   
        var tempUL = document.createElement('ul');
       
        for(var j = 0; j < groups[i].length; j++)
        {
            var tempLI = document.createElement('li');
            tempLI.innerHTML = groups[i][j];
            tempUL.appendChild(tempLI);
        }
        list.appendChild(tempUL);
    }
    document.body.appendChild(list);
}

function findErrors()
{

}