JSFiddle - React, Tailwind, and code Playground

HTML

<!-- End of search inputs -->
<div class="col-md-4 text-right text-muted small">
            <span class="glyphicon glyphicon-search"></span>

            <div>

                <p class="custsearch" id="scode" style="font-size:small"></p>

            </div>
            <div>
                <p class="custsearch" id="saccount" style="font-size:small"></p>
            </div>
            <div>
                <p class="custsearch" id="sname" style="font-size:small"></p>
            </div>
            <div>
                <p class="custsearch" id="semail" style="font-size:small"></p>
            </div>
            <div>
                <p class="custsearch" id="sphone" style="font-size:small"></p>
            </div>
            <div>
                <p class="custsearch" id="sstore" style="font-size:small"></p>
            </div>
            <div>
                <p class="custsearch" id="sbalance" style="font-size:small"></p>
            </div>
            <div>
                <p class="custsearch" id="sallowance" style="font-size:small"></p>
            </div>
</div>
<!-- End of search inputs -->
      
     <table  id="customerstable" class="display">


                <thead>

                    <tr>
                        <th>
                            Code
                        </th>
                        <th>
                            Account
                        </th>
                        <th>
                            Name
                        </th>
                        <th>
                            Email
                        </th>
                        <th>
                            Phone
                        </th>
                        <th>
                            Store
                        </th>
                        <th>
                            Balance
                        </th>
                        <th>
                            Allowance
                        </th>

                     ...

JavaScript

$(document).ready(function () {
            var custTable = $("#customerstable").dataTable({
                'bServerSide': true,
                'bProcessing': true,
                'sAjaxSource': '/Accounting/Customers/GetAjax',
                "bJQueryUI": false,
                "bAutoWidth": true,
                "bPaginate": true,
                "responsive": true,
                "sScrollX" : "100%",
                "bFilter": true
            }).columnFilter({
                aoColumns: [
                    { sSelector: "#scode" },
                    { sSelector: "#saccount" },
                    { sSelector: "#sname" },
                    { sSelector: "#semail"},
                    { sSelector: "#sphone" },
                    { sSelector: "#sstore" },
                    { sSelector: "#sbalance" },
                    { sSelector: "#sallowance" }
                   
                ]
            }
			);


            $(".dataTables_filter").remove();
        });