JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://www.jsviews.com/download/jsrender.js"></script>
<script id="template" type="text/x-jsrender">
    {^{for R1}}
        column: {^{:#index+1}}
    
        <p>{^{:#data}}</p>
        <br/><br/>
    {{/for}}
</script>

<div id="div1"></div>

JavaScript

var structure = {
  R1: [
    [ // column 1
        { K1: 'V111', K2: 'V121' },
        { K1: 'V112', K2: 'V122' },
        { K1: 'V113', K3: 'V123' },
        { K1: 'V114', K4: 'V124' },
    ],
    [ // column 2
        { K1: 'V211', K2: 'V221' },
        { K1: 'V212', K2: 'V222' },
    ]
  ],
  R2: [],
  R3: [],
  R4: []
};

$("#div1").html(
    $("#template").render(structure)
);