JSFiddle - React, Tailwind, and code Playground

HTML

<html>
    <head>
        <script language='javascript'>
        var menu = [
            [ "item0", "desc0" ], [ "item1", "desc1" ], [ "item2", "desc2" ], // row 1
            [ "item3", "desc3" ], [ "item4", "desc4" ], [ "item5", "desc5" ], // row 2
            [ "item6", "desc6" ], [ "item7", "desc7" ], [ "item8", "desc8" ], // row 3
            [ "item9", "desc9" ], [ "itemA", "descA" ], [ "itemB", "descB" ], // row 4
            [ "itemC", "descC" ], [ "itemD", "descD" ], [ "itemE", "descE" ], // row 5
        ];
        </script>
    </head>
    <body onload='CreateMenu();' style='color:black;font-size:22pt;'></body>
</html>

JavaScript

function CreateBasicDiv( className, id )
        {
            var div = document.createElement( "div" );
            div.id = "item" + parseInt( id );
            div.className = className;
            // optional: assign any other DIV parameters you need/want...
    
            return div;
        }

        function CreateItemDiv( item, desc )
        {
            var div = [], classes = [ "menu-column-wrapper", "menu-column", "menu-item", "item-header", "item-descripton" ];

            // iteratively create a series of <DIV> elements with proper classNames
            for ( var i = 0; i < classes.length; i++ )
                div[ i ] = CreateBasicDiv( classes[ i ], i );

            // consider putting the 'h3' styling into the CSS, or the 'item' string itself
            div[ 3 ].innerHTML = "<h3>" + item + "</h3>";

            // likewise, the <p>aragraphing should probably be done within the 'desc' string...
            div[ 4 ].innerHTML = "<p>" + desc + "</p>"

						div[ 2 ].appendChild( div[ 3 ] );
						div[ 2 ].appendChild( div[ 4 ] );

            // 'nest' the div's...
            for (var i = 2; i > 0; )
               div[ i-1 ].appendChild( div[ i-- ] );

           return div[ 0 ];
        }

        function CreateMenu()
        {
            var table = document.createElement( "table" ), 
                colCount = 3, i = 0, width = Math.round( 90 / colCount );

            // Override class definitions for these settings:
            table.style = "position:relative;width:90%;left:5%;table-layout:fixed;";
            table.border = 1;

            while ( i < menu.length )
            {
               var tr = document.createElement( "tr" );
               do {
                  var td = document.createElement( "td" );
                  td.style.width = width + "%"; // <-- enforce cell width
                  td.appendChild( CreateItemDiv( menu[ i ][0], menu[ i ][1] ) );
                  tr.appendChild( td );
               } while (...