JSFiddle - React, Tailwind, and code Playground
HTML
<input type="text" class="amount_available"/>
<div class="multiple_spec">
<div class="some_class">
<input type="text" name="quantity1"/>
<input type="text" name="quantity2"/>
<input type="text" name="quantity3"/>
</div>
</div
<div class="multiple_price">
<div class="random_class">
<input type="text" name="quantity4"/>
<input type="text" name="quantity5"/>
<input type="text" name="quantity6"/>
</div>
</div>
JavaScript
var $quantityInputs = $(".multiple_spec input[name*=quantity]");
$quantityInputs.on('keyup',function(e){
var amount_available = +$('input.amount_available').val(),
total_quantity = $quantityInputs.map(function(i, el){
return +$(el).val() || 0;
}).get().reduce(function(prev, curr){
return prev + curr;
}, 0);
if(total_quantity > amount_available){
console.log('total quantity exceeds available amount - do something');
$(this).val(function(index,value){
return value.substr(0,value.length-1);
});
}
});