JSFiddle - React, Tailwind, and code Playground

HTML

<div class="form-group">
             <input id="track_filter" type="text" class="form-control" placeholder="Search">
         </div>
<input type="hidden" class="ap-checkbox-check-all" data-group="applications">

<div id="track_apps" >

  <div class="clearfix">
    <div class="border-bottom m-t-md">
      <h4><strong>Office</strong></h4>
    </div>


    <div class="product-um-box track box-minimal">
      <div class="box-content is-rounded">


        <div class="software-title">
          Chrome
        </div>

        <div class="vendor-title">
          by Google
        </div>

        <div class="product-info">
          <div class="item-info">
            Last version: 1.0
          </div>
        </div>                             
      </div>
    </div>
  </div>
  <div class="clearfix">
    <div class="border-bottom m-t-md">
      <h4><strong>Other</strong></h4>
    </div>


    <div class="product-um-box track box-minimal">
      <div class="box-content is-rounded">                                
        <div class="software-title">
          FireFox
        </div>

        <div class="vendor-title">
          by Mozilla
        </div>

        <div class="product-info">
          <div class="item-info">
            Last version: 3.0
          </div>
        </div>
      </div>
    </div>
  </div>
</div>

JavaScript

$(document).ready(function(){
    $("#track_filter").keyup(function(){
 
        // Retrieve the input field text

// replace each of the English vowels with all the accentuated equivalents, including the plain English version.
        var filter = $(this).val().trim();
        // reset the count to zero
         var count = 0;
 
        // Loop through the visual guide list
        $("#track_apps .product-um-box").each(function() {
 						var softName = $(this).find(".software-title").first().text().toLowerCase().trim();
            var vendorName = $(this).find(".vendor-title").first().text().toLowerCase().trim();
            // If the list item does not contain the text phrase fade it out
            if (!softName.includes(filter) || !vendorName.includes(filter)) {
                $(this).fadeOut("fast");
 
            // Show the list item if the phrase matches and increase the count by 1
            } else {
                $(this).show();
                count++;
            }
        });
 
        // Update the count
        var numberItems = count;
        $("#filter-count").html("&nbsp;&nbsp;&nbsp;Number of Guides: "+count);
    });
});