JSFiddle - React, Tailwind, and code Playground

by kiokotzu

HTML

<div>
    <a class="restar" style="cursor:pointer;">-</a>
	<input name="valor" id="valor" value="0" size="4" />
	<a class="mas" style="cursor:pointer;">+</a>
</div>
       
<div>
    <a class="restar" style="cursor:pointer;">-</a>
	<input name="valor" id="valor" value="0" size="4" />
	<a class="mas" style="cursor:pointer;">+</a>
</div>

JavaScript

var valor = 0;

function tomarValor(q){
  valor = q.parent().find('input').val();  
}

function restar(){
    if(valor != 0)
        valor--
    else
        valor = 0
}

$(function(){
    $('.mas').click(function(){
        tomarValor($(this));
        valor++
        $(this).parent().find('input').val(valor);
    });
    
    $('.restar').click(function(){
        tomarValor($(this));
        restar();
        $(this).parent().find('input').val(valor);
    });
})