JSFiddle - React, Tailwind, and code Playground

HTML

<u>Table1</u>

<table class="applyHeader">
<thead>
  <tr>
    <th title="header11">header1</th>    
    <th title="header12">header2</th>    
    <th title="header13">header3</th>


  </tr>
</thead>
<tbody>
  <tr><td>col11</td><td>col12</td><td>col13</td></tr>
</tbody>
</table>
<br>
<u>Table2</u>

<table class="applyHeader">
<thead>
  <tr>
    <th title="header21">header1</th>    
    <th title="header22">header2</th>    
    <th title="header23">header3</th>


  </tr>
</thead>
<tbody>
  <tr><td>col21</td><td>col22</td><td>col23</td></tr>
</tbody>
</table>

<br>
<u>Table3</u>

<table >
<thead>
  <tr>
    <th title="header31">header1</th>    
    <th title="header32">header2</th>    
    <th title="header33">header3</th>


  </tr>
</thead>
<tbody>
  <tr><td>col31</td><td>col32</td><td>col33</td></tr>
</tbody>
</table>

JavaScript

(function() {
          "use strict";
          $('table.applyHeader').each(function() {
              var tableSelected=this;
          $(this).find('th').each(function(index) {
           var headerTitle = $(this).attr('title');
           $(tableSelected).find('tbody').find('td').eq(index).attr('title',headerTitle);
          });
          });

      }());