JSFiddle - React, Tailwind, and code Playground

HTML

<input/>
<input/>

JavaScript

$(function () {
    $.fn.clickCount = function () {
        var clickCount = 0;
        var clickBehaviour = 0;

        return {
            increment: function () {
                clickCount++;
            },
            behaviour: function () {
                clickBehaviour -= 5;
            },
            getBehaviour: function () {
                return clickBehaviour;
            },
            print: function () {
                console.log('Click count:' + clickCount);
                console.log('Click behaviour:' + clickBehaviour);
            }
        };
    };

    $.fn.tabCount = function () {
        var tabCount = 0;
        var tabBehaviour = 0;

        return {
            increment: function () {
                tabCount++;
            },
            behaviour: function () {
                tabBehaviour += 5;
            },
            getBehaviour: function () {
                return tabBehaviour;
            },
            print: function () {
                console.log('Tab count:' + tabCount);
                console.log('Tab behaviour:' + tabBehaviour);
            }
        };
    };



    var $input = $('input, select, textarea');
    var c = $.fn.clickCount();
    var t = $.fn.tabCount();

    function printSum() {
        console.log('Sum:' + (c.getBehaviour() + t.getBehaviour()));
    }
    $input.mousedown(function () {
        c.increment();
        c.behaviour();
        c.print();
        printSum()
    });

    $input.keydown(function (e) {
        var keyCode = e.keyCode || e.which;

        if (e.keyCode === 9) {
            $(this).each(function () {
                t.increment();
                t.behaviour();
                t.print();
                printSum()
            });
        };
    });


});