JSFiddle - React, Tailwind, and code Playground

HTML

<div id='menu'>
    <form id='form'>
      Rows: <input type="text" name="rows" id='rows' value='3'/><br />
      Cols: <input type="text" name="cols" id='cols' value='3'/><br />
      <input type="submit" value="Submit" />
    </form>
</div>
<div id='content'>
    
</div>

CSS

#content {
    overflow:auto;
    padding:5px;
    margin:5px;
    border:1px dotted blue;
}

#menu {
    overflow:auto;
    padding:5px;
    margin:5px;
    border:1px dotted blue;
}

.float {
    position:relative;
    float:left;
    width:150px;
    height:150px;
    border: 1px dotted green;
    
    text-align:center;  
}

.float a {
    font-weight:bold;
    position:absolute;
    top:50%;
    left:50%;
    width:100%;
    margin-left:-50%;
}

.float .float {
     width:32%;
     height:32%;
}

JavaScript

function stdLabel(div) {
    var strList = 'ABCDEFGHIJKLMNOPQRSTUVWXYZ';
    div.innerHTML = '<a>' + div.row + strList[div.col] + '</a>';
    
    //for fun coloring
    div.style.backgroundColor = 'rgb(225,'+(255-div.col*10)+','+(255-div.row*10)+')';
}

function hoverIn() {
    var node = this.firstChild;
    var self = this;
    
    function out( n ) {
        jQuery(n).fadeOut( function() {
            try {
                self.removeChild( n );
            } catch(e) {
                //does nothing   
            }
        } );
    }
    
    while( node ) {
        out( node );
        node = node.nextSibling;
    }
    
    function pt( a, b ) {
        var node = createNode( a, b );
        self.appendChild( node );
        jqNode = jQuery( node );
        //jqNode.fadeOut(0, function() { jqNode.fadeIn(); } );
        
        jqNode.hover( function() {
            //i do not know the logic here to make which node visible or not?
            //hence i shall randomize it XD
            var d = this.previousSibling;
            while( d ) { //cycle among all the previous siblings
                if( Math.random() > 0.5 ) { //random
                    jQuery(d).animate( { "opacity" : .0 }, 0); //fade out
                }
                d = d.previousSibling;
            }
            
            d = this.nextSibling;
            while( d ) { //cycle among all the next siblings
                if( Math.random() > 0.5 ) { //random
                    jQuery(d).animate( { "opacity" : .0 }, 0); //fade out
                }
                d = d.nextSibling;
            }
            
        },
        function() {//im leaving -> all in
            var d = this.previousSibling;
            while( d ) { //cycle among all the previous siblings
                jQuery(d).animate( { "opacity" : 1 }, 0); //fade in
                d = d.previousSibling;
            }
            d = this.nextSibling;
            while( d ) { //cycle among all the previous...