JSFiddle - React, Tailwind, and code Playground

by Kai_Draord

HTML

<a href="#">test</a>
<page size="A4" class="flex-container">
  <div class="divTable flex-container" style="width: 70%;border: 2px solid #000;">
    <div class="divTableBody">
      <div class="divTableRow">
        <div class="divTableCell">
        </div>
        <div class="divTableCell">1
        </div>
        <div class="divTableCell">101
        </div>
        <div class="divTableCell">2
        </div>
        <div class="divTableCell">102
        </div>
        <div class="divTableCell">3
        </div>
        <div class="divTableCell">103
        </div>
      </div>
      <div class="divTableRow">
        <div class="divTableCell">4
        </div>
        <div class="divTableCell">104
        </div>
        <div class="divTableCell">5
        </div>
        <div class="divTableCell">105
        </div>
        <div class="divTableCell">6
        </div>
        <div class="divTableCell">106
        </div>
        <div class="divTableCell">7
        </div>
      </div>
      <div class="divTableRow">
        <div class="divTableCell">107
        </div>
        <div class="divTableCell">8
        </div>
        <div class="divTableCell">108
        </div>
        <div class="divTableCell">9
        </div>
        <div class="divTableCell">109
        </div>
        <div class="divTableCell">10
        </div>
        <div class="divTableCell">110
        </div>
      </div>
      <div class="divTableRow">
        <div class="divTableCell">11
        </div>
        <div class="divTableCell">111
        </div>
        <div class="divTableCell">12
        </div>
        <div class="divTableCell">112
        </div>
        <div class="divTableCell">13
        </div>
        <div class="divTableCell">113
        </div>
        <div class="divTableCell">14
        </div>
      </div>
      <div class="divTableRow">
        <div class="divTableCell">114
        </div>
        <div class="divTableCell">15
        </div>
        <div class="divTableCell">115
       ...

JavaScript

$("a").click(function(){
$(".divTable").each(function() {
    var $this = $(this);
    var newrows = [];
    $this.find(".divTableRow").each(function(){
        var i = 0;
        $(this).find(".divTableCell").each(function(){
            i++;
            if(newrows[i] === undefined) { newrows[i] = $("<div class='divTableRow'></div>"); }
            newrows[i].append($(this));
        });
    });
    $this.find(".divTableRow").remove();
    $.each(newrows, function(){
        $this.append(this);
    });
});
return false;
});