JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="//code.jquery.com/ui/1.11.2/themes/smoothness/jquery-ui.css">
<script src="//code.jquery.com/jquery-2.1.3.js" type="text/javascript"></script>
<script src="//code.jquery.com/ui/1.10.4/jquery-ui.min.js" type="text/javascript"></script>Search:
<input style="margin-right: 200px " type="text" class="text-input" id="filter" value="" />
<span id="filter-count"></span>

<br />
<br />
<div id="accordion">
    <h3><a href="#">First header</a></h3>
    
        <div id="head" class="head">   
            <div class="test"><b>Email:</b>Email</div>
            <div class="test"><b>Department:</b> Department</div>
            <div class="test"><b>Link:</b>Link</div>
            <div class="test"><b>Outside:</b> Outside</div>
        </div>
    
    <h3><a href="#">Second header</a></h3>
    <div id="head" class="head"><b>Second content:</b> content</div>
</div>

CSS

.found {
    background: lightgreen;
    display: inline;
    padding: 0;
    margin:0;
}

JavaScript

$(function ($) {
        $("#accordion").accordion({
            collapsible: true,
            active: false
        });
    });

    $(document).ready(function () {
        function doSearch(el, f) {

            var d = el.text().trim(),
                m = d.split(f);

            $.each(m, function (i, v) {
                if (i == m.length - 1) {
                    return;
                }
                v += "<p class=found>" + f + "</p>";
                m[i] = v;
            });

            el.html(m.join(''));
            $("#accordion").accordion({
            collapsible: true,
            active: false
        });
        }

        $("#filter").keyup(function () {
            // Retrieve the input field text and reset the count to zero
            var filter = $(this).val(),
                count = 0;

            // Loop through the comment list
            $("#accordion h3").each(function () {
                var header = $(this),
                    content = header.next('.head'),
                    exp = new RegExp(filter, "i");

                // If the list item does not contain the text phrase fade it out
                if (header.text().search(exp) < 0 && content.text().search(exp) < 0) {
                    header.fadeOut();
                    content.fadeOut();
                    // Show the list item if the phrase matches and increase the count by 1
                } else {
                    header.show();
                    content.show();
                    $("#accordion").accordion({
                    active: false
                });
                
                $('#accordion').accordion("refresh"); 

                    //doSearch(header, filter);
                    //doSearch(content, filter);
                    count++;
                }
            });

            // Update the count
            var numberItems = count;
            $("#filter-count").text("Number of Comments = " + count);
            
       ...