JSFiddle - React, Tailwind, and code Playground

HTML

<!DOCTYPE html>
<html>
  <head>
  
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jquery.tablesorter/2.31.0/css/theme.default.min.css">
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery.tablesorter/2.31.0/js/jquery.tablesorter.min.js"></script>

    <meta charset=utf-8 />
    <title>DataTables - JS Bin</title>
  </head>
  <body>
    <div class="container">
<table cellspacing="1" id="myTable" class="table">
  <thead>
    <tr>
      <th>No</th>
      <th>Group</th>
      <th>Element</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td rowspan="2">1</td>
      <td rowspan="2">Group3</td>
      <td>Element1</td>
    </tr>
    <tr class="tablesorter-childRow">
      <td>Element2</td>
    </tr>
    <tr>
      <td rowspan="2">2</td>
      <td rowspan="2">Group2</td>
      <td>Element1</td>
    </tr>
    <tr class="tablesorter-childRow">
      <td>Element2</td>
    </tr>
    <tr>
      <td rowspan="2">3</td>
      <td rowspan="2">Group1</td>
      <td>Element1</td>
    </tr>
    <tr class="tablesorter-childRow">
      <td>Element2</td>
    </tr>
  </tbody>
</table>
    </div>
  </body>
</html>

JavaScript

$(document).ready(function() 
    { 
        $("#myTable").tablesorter(); 
    } 
);