JSFiddle - React, Tailwind, and code Playground

HTML

<form action="test" method="POST">
                                <div class="form-row pad0B">
                                    <div class="form-label col-md-2">
                                        <label for="">
                                            Car Search
                                        </label>
                                    </div>
                                    <div class="form-input col-md-10">
                                        <input placeholder="carName" type="text" name="carName" id="carName" autocomplete="off">
                                    </div>
                                </div>
                            </form>

<table class="table table-hover" id="carsTable">
                                <thead>
                                <tr>
                                    <th>Car Title</th>
                                    <th>Actions</th>
                                </tr>
                                </thead>
                                <tbody>
                                <tr id="product-test">
                                    <td>Car Product</td>
                                    <td><a href="#" class="black-modal-80" id="12345">+</a></td>
                                </tr>
                                </tbody>
                                <tfoot>
                                <tr>
                                    <th>Product Title</th>
                                    <th>Actions</th>
                                </tr>
                                </tfoot>
                            </table>

JavaScript

$.fn.changeOrDelayedKey = function(fn, iKeyDelay, sKeyEvent) {
                var iTimeoutId,
                        oEventData;

                // second signature used, update the variables
                if (!$.isFunction(fn)) {
                    oEventData = arguments[0];
                    fn = arguments[1];
                    iKeyDelay = arguments[2];
                    sKeyEvent = arguments[3];
                }

                if (!iKeyDelay || 0 > iKeyDelay) {
                    iKeyDelay = 500;
                }

                if (!sKeyEvent || !this[sKeyEvent]) {
                    sKeyEvent = 'keydown';
                }

                // non-delayed event callback, should clear any timeouts, then
                // call the original callback function
                function fnExecCallback(e) {
                    if ( e.type != sKeyEvent )
                        return;
                    clearTimeout(iTimeoutId);
                    fn.apply(this, arguments);
                }

                // delayed event callback, should call the non-delayed callback
                // after a short interval
                function fnDelayCallback() {
                    var that = this,
                            args = arguments;
                    clearTimeout(iTimeoutId);
                    iTimeoutId = setTimeout(function() {
                        fnExecCallback.apply(that, args);
                    }, iKeyDelay);
                }

                if (oEventData) {
                    this.change(oEventData, fnExecCallback);
                    this[sKeyEvent](oEventData, fnDelayCallback);
                }
                else {
                    this.change(fnExecCallback);
                    this[sKeyEvent](fnDelayCallback);
                }

                return this;
            };

            $('#carName').changeOrDelayedKey(function(e) {
                var random = Math.random();
               ...