JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="https://yadcf-showcase.appspot.com/resources/css/jquery.dataTables.10.min.css">
<link rel="stylesheet" href="https://yadcf-showcase.appspot.com/resources/css/dataTables.jqueryui.css">
<link rel="stylesheet" href="https://yadcf-showcase.appspot.com/resources/css/jquery-ui.1.9.0.css">
<link rel="stylesheet" href="https://yadcf-showcase.appspot.com/resources/css/select2.css">
<link rel="stylesheet" href="https://yadcf-showcase.appspot.com/resources/css/jquery.dataTables.yadcf.css">
<link rel="stylesheet" href="https://cdn.datatables.net/colreorder/1.3.2/css/colReorder.dataTables.min.css">
<script src="https://code.jquery.com/jquery-1.12.4.min.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.min.js"></script>
<script src="https://yadcf-showcase.appspot.com/resources/js/select2.js"></script>
<script src="https://cdn.datatables.net/v/dt/dt-1.10.12/datatables.min.js"></script>
<script src="https://cdn.datatables.net/colreorder/1.3.2/js/dataTables.colReorder.min.js"></script>
<script src="https://yadcf-showcase.appspot.com/resources/js/jquery.dataTables.yadcf.js"></script>
                <table id="example" cellpadding="0" cellspacing="0" border="0" class="table table-striped">
                    <thead>
                        <tr>
                            <th>RFCs</th>
                            <th>Project</th>
                            <th>RFC status</th>
                            <th>Description</th>
                            <th>Bussiness aplication</th>
                            <th>Test manager</th>
                            <th>Remedy</th>
                            <th>Client</th>
                            <th>Test status</th>
                            <th>VºBº status</th>
                            <th>Init date</th>
                            <th>End date</th>
                        </tr>
                    </thead>
                    <tbody>
                        <tr>
            ...

JavaScript

'use strict';

            var oTable = $('#example').DataTable({
                colReorder: true,
                language : {
                    "url": "http://cdn.datatables.net/plug-ins/1.10.12/i18n/Spanish.json"
                },              
            });
            yadcf.init(oTable, [
            {
                column_number: 0,
                    filter_type: "multi_select",
                    select_type: 'select2',
                }, {
                    column_number: 1,
                    filter_type: "multi_select",
                    select_type: 'select2',
                    column_data_type: "html",
                    html_data_type: "text",
                }, {
                    column_number: 2,
                    filter_type: "multi_select",
                    select_type: 'select2',
                    column_data_type: "html",
                    html_data_type: "text",
                }, {
                    column_number: 10,
                    filter_type: "range_date",
                    date_format: "dd/mm/yyyy",
                    filter_delay: 500
            }]);