JSFiddle - React, Tailwind, and code Playground
HTML
<div class="cart-item-info much">
<a href="#" class="jsminus">-</a>
<input type="text" value="1" id="input1">
<a href="#" class="jsplus">+</a>
</div>
CSS
.much a {
padding: 2px;
border: 1px solid #e5e5e5;
text-decoration: none;
}
.much .jsminus {
background: #d73339;
color: #ffffff;
margin-right: -5px;
}
.much .jsplus {
background: #d73339;
color: #ffffff;
margin-left: -5px;
}
JavaScript
$( ".jsminus" ).click(function(){
var much = +$(this).closest(".much").find("input").val();
var result = much - 1;
$(this).closest(".much").find("input").val(result)
return true;
});
$( ".jsplus" ).click(function(){
var much = +$(this).closest(".much").find("input").val();
var result = much + 1;
$(this).closest(".much").find("input").val(result)
return true;
});