title: Change just one input field with javascript
body: <p>I have code like this:</p>
  
  <pre><code>&lt;script&gt;
  (function() {
  
    window.inputNumber = function(el) {
      var min = el.attr('min') || false;
      var max = el.attr('max') || false;
  
      var els = {};
  
      els.dec = el.prev();
      els.inc = el.next();
  
      el.each(function() {
        init($(this));
      });
  
      function init(el) {
  
        els.dec.on('click', decrement);
        els.inc.on('click', increment);
  
        function decrement() {
          var value = el[0].value;
          value--;
          (value&lt;1) ? value=1 : '';
          if(!min || value &gt;= min) {
            el[0].value = value;
          }
        }
  
        function increment() {
          var value = el[0].value;
          value++;
          if(!max || value &lt;= max) {
            el[0].value = value++;
          }
        }
      }
    };
  })();
  
  inputNumber($('.input-number'));
  &lt;/script&gt;
  </code></pre>
  
  <p>but this will change every input field when I click on one decrement or increment... But I need to be separated and dynamic, here is html:</p>
  
  <pre><code>&lt;div class="quantity"&gt;
      &lt;span class="input-number-decrement" style="margin-right: 15px;"&gt;&lt;i class="fa fa-angle-left"&gt;&lt;/i&gt;&lt;/span&gt;&lt;input type="text" step="4" min="" max="" name="" value="0"  class="input-number" size="4" /&gt;
  &lt;span class="input-number-increment" style="margin-left: 10px;"&gt;&lt;i class="fa fa-angle-right"&gt;&lt;/i&gt;&lt;/span&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>I can have more then one input field, and all need to work separately... Any solution?</p>