JSFiddle - React, Tailwind, and code Playground

by hslincoln

HTML

<div id="qtybox"><label for="qty">

<input name="qty" id="qty" type="text" value="1" size="3" maxlength="2">

</div>
    <button id="qtyplus">+</button>
    <button id="qtyminus">-</button>

CSS

#qtybox {
    clear: both;
    color: #8B8B8B;
    float: left;
    font-size: 1.083em;
    font-weight: bold;
    height: 28px;
    padding-left: 5px;
    width:70px;
}

JavaScript

$(function(){
    $("#qtyplus").click(function(){
      $(":text[name='qty']").val( Number($(":text[name='qty']").val()) + 1 );
    });
    $("#qtyminus").click(function(){
      $(":text[name='qty']").val( Number($(":text[name='qty']").val()) - 1 );
    });
  });