JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
        <div class="col-sm-4">
            <div class="form-group">
                <label for="category">Condition</label>
                <input type="text" class="form-control" id="condition-search">
            </div>
            <div class="form-group">
                
                <select class="form-control" id="condition" size="15" style="overflow-y: scroll";>
 <option class="cat-1">Item1</option>
        <option class="cat-2">item2</option>
        <option class="cat-3">Item3</option>
        <option class="cat-4">item4</option>
        <option class="cat-5">Item5</option>
                </select>
            </div>
        </div>

JavaScript

$(document).on('keyup', '#condition-search', function (e) {
    var str = $('#condition option:contains(' + $(this).val() + ')');
    if (str) {
        $('#condition option').hide();
        str.show();
    } else {
        $('#condition option').show();
    }
});