JSFiddle - React, Tailwind, and code Playground

HTML

<table class="table-highlight" id="dados">
    <thead>
        <tr>
            <th data-field="id">Item</th>
            <th data-field="numero">Número de Rastreamento</th>
            <th data-field="data">Enviado em</th>
            <th data-field="status">Status</th>

        </tr>
    </thead>

    <tbody>
        <tr>
            <td>Pacote 01</td>
            <td><a class="waves-effect waves-light btn" href="#modal1">BR021WMR000016437462</a></td>
            <td>20/01/2017</td>
            <td><span>Em trânsito</span></td>

        </tr>
        <tr>
            <td>Pacote 02</td>
            <td><a class="waves-effect waves-light btn" href="#modal1">SP021WMR000016437462</a></td>
            <td>15/01/2017</td>
            <td><span>Entregue</span></td>

        </tr>
        <tr>
            <td>Pacote 03</td>
            <td><a class="waves-effect waves-light btn" href="#modal1">CR021WMR000016437462</a></td>
            <td>20/01/2017</td>
            <td><span>Cancelado</span></td>

        </tr>
    </tbody>
</table>
<div>
    <input type="text" id="search">
    <button>Pesquisar</button>
</div>

JavaScript

document.querySelector('button').addEventListener('click', pesquisaTabela);

function pesquisaTabela() {
    // Declare variables
    var input, filter, table, tr, td, i;
    input = document.getElementById("search");
    filter = input.value.toUpperCase();
    table = document.getElementById("dados");
    tr = table.getElementsByTagName("tr");
    // Loop through all table rows, and hide those who don't match the search query
    for (i = 0; i < tr.length; i++) {
        var match = tr[i].innerHTML.toUpperCase().indexOf(filter) > -1;
        tr[i].style.display = match ? "block" : "none";
    }
}