JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="//datatables.net/download/build/nightly/jquery.dataTables.css">
<script src="//datatables.net/download/build/nightly/jquery.dataTables.js"></script>
  <body>
    <a id="click_all" href="#">Click All</a>
    <div class="container">
      <table id="example" class="display" width="100%">
        <thead>
          <tr>
            <th>Name</th>
            <th>Office</th>
            <th>Options</th>
          </tr>
        </thead>

        <tfoot>
          <tr>
            <th>Name</th>
            <th>Office</th>
            <th>Options</th>
          </tr>
        </tfoot>

        <tbody>
          <tr>
            <td>Tiger Nixon</td>
            <td>London</td>
            <td><a href="#" class="link">Link</a></td>
          </tr>
          <tr>
            <td>Garrett Winters</td>
            <td>Edinburgh</td>
            <td><a href="#" class="link">Link</a></td>
          </tr>
          <tr>
            <td>Ashton Cox</td>
            <td>San Francisco</td>
            <td><a href="#" class="link">Link</a></td>
          </tr>
          <tr>
            <td>Cedric Kelly</td>
            <td>Edinburgh</td>
            <td><a href="#" class="link">Link</a></td>
          </tr>
          <tr>
            <td>Jenna Elliott</td>
            <td>Edinburgh</td>
            <td><a href="#" class="link">Link</a></td>
          </tr>
          <tr>
            <td>Brielle Williamson</td>
            <td>New York</td>
            <td><a href="#" class="link">Link</a></td>
          </tr>
          <tr>
            <td>Herrod Chandler</td>
            <td>San Francisco</td>
            <td><a href="#" class="link">Link</a></td>
          </tr>
          <tr>
            <td>Rhona Davidson</td>
            <td>Edinburgh</td>
            <td><a href="#" class="link">Link</a></td>
          </tr>
          <tr>
            <td>Colleen Hurst</td>
            <td>San Francisco</td>
            <td><a href="#" class="link">Link</a></td>
     ...

CSS

body {
  font: 90%/1.45em "Helvetica Neue", HelveticaNeue, Verdana, Arial, Helvetica, sans-serif;
  margin: 0;
  padding: 0;
  color: #333;
  background-color: #fff;
}

JavaScript

$(document).ready( function () {
    var table = $('#example').DataTable( {
        createdRow: function ( tr ) {
            $('.link', tr).on('click', function() {
                $(this).html('CLICKED').removeClass('link');
                return false;
            });
        }
    } );
    
    $(document).on('click', '#click_all', function() {
        table.rows( { filter: 'applied' } ).nodes().to$().find('a').click();
        
        return false;
    });
    
});