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){ //prevent anything other than numeric characters, backspace, delete, and left & right arrows
       return true;
   }
})
.keyup(function(){
   val = $(this).val();
   if(val > 10){
       val = 10;
       $(this).val(10);
       $('#message').text("no more than 10");
          
   }
   $('#amount').text(val * 10);
});