JSFiddle - React, Tailwind, and code Playground

HTML

<input type='button' id='minus'/>
<div class='range-container'>
    <input id='range' type='range' min='0' max='100' step='1'/>
</div>
<input type='button' id='plus'/>

CSS

#plus {
    width: 15px;
    height: 15px;
    background-color: red;
    float: left;
}

#minus {
    width: 15px;
    height: 15px;
    background-color: blue;
    float: left;
}

.range-container {
    float: left;
    overflow: auto;
}

JavaScript

var range = $('#range');

function increment () {
    range.val(parseInt(range.val()) + 1)
}

function decrement () {
    range.val(parseInt(range.val()) - 1)
}

function poll (el, interval, fn) {
    var isHeldDown = false;
    
    return el
    .on("mousedown", function() {
        isHeldDown = true;
        (function loop (range) {
            if (!isHeldDown) return;
            fn();
            setTimeout(loop, interval);        
        })();
    })
    .on("mouseup mouseleave", function () {
        isHeldDown = false;
    });
}

poll($("#plus"), 40, increment);
poll($("#minus"), 40, decrement);