JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://cdn.datatables.net/1.10.7/js/jquery.dataTables.min.js"></script>
<table id="myTable" class="display" cellspacing="0" width="100%">
        <thead>
            <tr>
                                <th align="left" style="font-size:10px">DATA EXPEDIÇÃO</th>
                                <th align="left" style="font-size:10px">STATUS ENTREGA</th>
                                <th align="left" style="font-size:10px">DATA ENTREGA</th>
                                <th align="left" style="font-size:10px">CONFIRMACAO</th>
            </tr>
            <tr id="filterrow">
                                <th align="left" style="font-size:10px">DATA EXPEDIÇÃO</th>
                                <th align="left" style="font-size:10px">STATUS ENTREGA</th>
                                <th align="left" style="font-size:10px">DATA ENTREGA</th>
                                <th align="left" style="font-size:10px">CONFIRMACAO</th>
            </tr>
        </thead>
 
        <tbody>
           <tr>
               <td height="2px">01/01/2015</td>
               <td height="2px">Entregue</td>
                <td height="2px">10/01/2015</td>
                <td height="2px">ok</td>
          </tr>   
             <tr>
               <td height="2px">01/07/2015</td>
               <td height="2px">Ausente</td>
                <td height="2px">10/08/2015</td>
                <td height="2px">No</td>
          </tr> 
             <tr>
               <td height="2px">01/08/2015</td>
               <td height="2px">Entregue</td>
                <td height="2px">10/09/2015</td>
                <td height="2px">ok</td>
          </tr> 
             <tr>
               <td height="2px">01/01/2015</td>
               <td height="2px">Entregue</td>
                <td height="2px">10/01/2015</td>
                <td height="2px">ok</td>
          </tr> 
             <tr>
               <td height="2px">01/08/2015</td>
               <td...

JavaScript

// Setup - Adicioona o input no header da tabela
    $('#myTable thead tr#filterrow th').each( function () {
        var title = $('#myTable thead th').eq( $(this).index() ).text();
        $(this).html( '<input type="text" onclick="stopPropagation(event);" placeholder="Search '+title+'" />' );
    } );
 
    // DataTable
    var table = $('#myTable').DataTable();
     
    // Aplica o filtro nas colunas
    $("#myTable thead input").on( 'keyup change', function () {
        table
            .column( $(this).parent().index()+':visible' )
            .search( this.value )
            .draw();
    } );

  function stopPropagation(evt) {
		if (evt.stopPropagation !== undefined) {
			evt.stopPropagation();
		} else {
			evt.cancelBubble = true;
		}
	}