JSFiddle - React, Tailwind, and code Playground

HTML

<body>
  <div class="col-md-12">
  <!--=== full width container ===-->
      <table id="psLicense" class="table table-striped table-bordered dt-responsive nowrap" cellspacing="0" width="100%">
       <thead>
        <tr>
          <th>ID</th>
          <th>License</th>
          <th>ABC ID</th>
          <th>Lic App</th>
          <th>Type</th>
          <th>Dupe</th>
          <th>Master</th>
          <th>Status</th>
          <th>Outlet Name</th>
          <th>Address</th>
          <th>City</th>
          <th>Zip</th>
          <th>County</th>
          <th>Class</th>
        </tr>
       </thead>
       <tfoot>
        <tr>
          <th>ID</th>
          <th>License</th>
          <th>ABC ID</th>
          <th>Lic App</th>
          <th>Type</th>
          <th>Dupe</th>
          <th>Master</th>
          <th>Status</th>
          <th>Outlet Name</th>
          <th>Address</th>
          <th>City</th>
          <th>Zip</th>
          <th>County</th>
          <th>Class</th>
        </tr>
       </tfoot>
      </table>
  </div>

CSS

<script src="//cdn.datatables.net/1.10.12/css/jquery.dataTables.min.css">

JavaScript

<script src="https://code.jquery.com/jquery-1.12.3.js"></script>
<script src="https://cdn.datatables.net/1.10.12/js/jquery.dataTables.min.js"></script>
<script src="https://code.jquery.com/jquery-2.2.4.js" integrity="sha256-iT6Q9iMJYuQiMWNd9lDyBUStIq/8PuOW33aOqmvFpqI=" crossorigin="anonymous"></script>
<script type="text/javascript" src="http://cdn.datatables.net/1.10.12/js/jquery.dataTables.min.js"></script>

<script type="text/javascript" class="init">

    $(document).ready(function() {

    $('#psLicense tfoot th').each( function () {
      var title = $(this).text();
        $(this).html( '<input type="text" placeholder="Search '+title+'" />' );
    } );

    var table = $('#psLicense').dataTable({
      'processing': true,
      'paging': true,
      'pagingType': 'full_numbers',
      'serverSide': true,
      'iDisplayLength': 10,
      'ajax': 'http://mydomain.com/ps_ss_process.php',
        columnDefs: [
            { targets: [1,3,4,6,8,9,10,11], visible: true },
            { targets: '_all', visible: false },
          ]
    } );

      table.columns().every( function () {
        var that = this;

          $( 'input', this.footer() ).on( 'keyup change', function () {
              if ( that.search() !== this.value ) {
                  that
                      .search( this.value )
                      .draw();
              }
          } );
    } );
    } );

  </script>