JSFiddle - React, Tailwind, and code Playground

HTML

<table class="table demo">
    <tr>
        <th data-title='Table 1'>Table 1</th>
        <th data-title='Table 2'>Table 2</th>
        <th data-title='Table 3'>Table 3</th>
        <th data-title='Table 4'>Table 4</th>
        <th data-title='Table 5'>Table 5</th>
        <th data-title='Table 6'>Table 6</th>
        <th data-title='Table 7'>Table 7</th>
        <th data-title='Table 8'>Table 8</th>
        <th data-title='Table 9'>Table 9</th>
        <th data-title='Table 10'>Table 10</th>
        <th data-title='Table 11'>Table 11</th>
    </tr>
    <tr>
        <td>Table Cell</td>
        <td>Table Cell</td>
        <td>Table Cell</td>
        <td>Table Cell</td>
        <td>Table Cell</td>
        <td>Table Cell</td>
        <td>Table Cell</td>
        <td>Table Cell</td>
        <td>Table Cell</td>
        <td>Table Cell</td>
        <td>Table Cell</td>
    </tr>
    <tr>
        <td>Table Cell</td>
        <td>Table Cell</td>
        <td>Table Cell</td>
        <td>Table Cell</td>
        <td>Table Cell</td>
        <td>Table Cell</td>
        <td>Table Cell</td>
        <td>Table Cell</td>
        <td>Table Cell</td>
        <td>Table Cell</td>
        <td>Table Cell</td>
    </tr>
    <tr>
        <td>Table Cell</td>
        <td>Table Cell</td>
        <td>Table Cell</td>
        <td>Table Cell</td>
        <td>Table Cell</td>
        <td>Table Cell</td>
        <td>Table Cell</td>
        <td>Table Cell</td>
        <td>Table Cell</td>
        <td>Table Cell</td>
        <td>Table Cell</td>
    </tr>
    <tr>
        <td>Table Cell</td>
        <td>Table Cell</td>
        <td>Table Cell</td>
        <td>Table Cell</td>
        <td>Table Cell</td>
        <td>Table Cell</td>
        <td>Table Cell</td>
        <td>Table Cell</td>
        <td>Table Cell</td>
        <td>Table Cell</td>
        <td>Table Cell</td>
    </tr>
</table>



<table class="table demo">
    <tr>
        <th data-title='Table 2231'>Table 1</th>
        <th data-title='Table...

CSS

.demo {
	    border:1px solid #C0C0C0;
	    border-collapse:collapse;
	    padding:5px;
	}
	.demo th {
	    border:1px solid #C0C0C0;
	    padding:5px;
	    background:#F0F0F0;
	}
	.demo td {
	    border:1px solid #C0C0C0;
	    padding:5px;
	}

JavaScript

//array to fill with ths
var ths = new Array();

//Clean the text
function trimIt(x) {
    return x.replace(/(^\s+|\s+$)/g, '');
}
//Fill ths array with header text
$(".table").each(function () {
    var thdatatrimmed = trimIt($(this).find('th').attr('data-title'));
    console.log(thdatatrimmed);
    ths.push(thdatatrimmed);
});

//total trs
$(".table").each(function () {
var trlen = $(this).find('tr').length;
console.log(trlen);
//add header to data-title attribute to each TD
for (var j = 0; j < trlen; j++) {
    //console.log(ths.length);
    for (var i = 0, len = ths.length; i < len; i++) {
        //console.log(ths[i]);
        $(this).find('tr').eq(j).find('td').eq(i).attr('data-title', ths[i]);
        //$('td:eq('+i+')').attr("data-title", ths[i]);
    }
}
});