JSFiddle - React, Tailwind, and code Playground
HTML
<input type="text" id="purchases"/>
<div id="amount"></div>
<div id="message"></div>
JavaScript
$('#purchases').keydown(function(e){
if(!(e.which >= 48 && e.which <=58) && e.which !== 8 && e.which !== 46 && e.which !== 37 && e.which !== 39){
e.preventDefault();
}
})
.keyup(function(){
val = parseInt($(this).val() || 0, 10);
if(val > 10){
val = 10;
$(this).val(10);
$('#message').text("no more than 10");
setTimeout(function() { $('#message').text(""); }, 2000);
}
$('#amount').text(val * 10);
});