JSFiddle - React, Tailwind, and code Playground

HTML

<input type="text" id="searchTerm" />
<input type="button" id="search" value="Search" />
<div id="noresults">No results found!</div>
<table id="dataTable">
    <tr>
        <th>Example No.</th>
        <th>Column 1</th>
        <th>Column 2</th>
    </tr>
    <tr>
        <td>345678917</td>
        <td>Test 1</td>
        <td>one_test1@gmail.com</td>
    </tr>
    <tr>
        <td>3512376894</td>
        <td>Test 2</td>
        <td>two.test2@hotmail.com</td>
    </tr>
</table>

CSS

#noresults, #dataTable tr {
    display: none;
}

JavaScript

function findRows(table, column, searchText) {
    var rows = table.rows,
        r = 0,
        found = false,
        anyFound = false;

    for (; r < rows.length; r += 1) {
        row = rows.item(r);
        found = (row.cells.item(column).textContent.indexOf(searchText) !== -1);
        anyFound = anyFound || found;

        row.style.display = found ? "table-row" : "none";
    }

    document.getElementById('noresults').style.display = anyFound ? "none" : "block";
}

function performSearch() {
    var searchText = document.getElementById('searchTerm').value,
        targetTable = document.getElementById('dataTable');

    findRows(targetTable, 0, searchText);
}

document.getElementById("search").onclick = performSearch;
document.getElementById("searchTerm").onkeyup = performSearch;