JSFiddle - React, Tailwind, and code Playground

HTML

<a class="minus">-</a><input class="col" value="5"><a class="plus">+</a>
<br><br>
<input class="grn" style="display:none;" value="100"><input class="fingrn" value="100">
<br>
<input style="display:none;" class="rub" value="200"><input class="finrub" value="200">
<br>
<input style="display:none;" class="usd" value="300"><input class="finusd" value="300">

CSS

.col
{
    float:left;
}
.plus, .minus
{
    
    background-color:green;
    height:10px;
    width:10px;
    padding:5px;
    line-height:10px;
    display:block;
    text-align:center;
    float:left;
}
.minus
{
  background-color:red;  
   
}
.plus
{
     margin:0 50px 0 0px;
}

JavaScript

$(document).ready(function(){
    $('.col').change(function(){ 
        if($(this).val()<0){alert("Нужно ведь вносить положительное число");}
        $('.result').val($('.price').val()*$(this).val()); 
    });
    $('.col').change(function(){ 
        $('.fingrn').val($('.grn').val()*$(this).val()); 
    });
    $('.col').change(function(){ 
        $('.finrub').val($('.rub').val()*$(this).val()); 
    });
    $('.col').change(function(){ 
        $('.finusd').val($('.usd').val()*$(this).val()); 
    });
    
     $(".minus").click(function(){
             $('.col').val($('.col').val()-1);      
            $('.col').change();
        });
                $(".plus").click(function(){
             $('.col').val(parseInt($('.col').val())+1);      
            $('.col').change();
        });
});