title: Increment value field issue in woocommerce
body: <p>With the following code on our <a href="http://tbdemo.tk/aquapark/tickets/" rel="nofollow"><strong>website</strong></a> (build with Wordpress and WooCommerce) located in the file <code>/woocommerce/templates/global/quantity-input.php</code>, I added some code in order to have several "Increment Value" buttons. Each button is supposed to increase the quantity value by 1 of the field located next to it. </p>
  
  <p>The trouble is that all buttons increases only the first top field value. </p>
  
  <p>I would like that each button interact only with the field located next to it, without reflecting on other fields.</p>
  
  <p>What i am doing wrong?<br> Please help me.</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false">
  <div class="snippet-code">
  <pre class="snippet-code-html lang-html prettyprint-override"><code>echo "&lt;script&gt;
  
  var i = 0;
      function buttonClick() {
          document.getElementById('inc').value = ++i;
  &lt;/script&gt;";
  
  
  
  
  if ( ! defined( 'ABSPATH' ) ) {
   exit; // Exit if accessed directly
  }
  ?&gt;
  &lt;div class="quantity"&gt;
  &lt;form&gt;
   &lt;input  type="number" id="inc" onfocus="if(this.value == '0') { this.value = ''; }" step="&lt;?php echo esc_attr( $step ); ?&gt;" min="&lt;?php echo esc_attr( $min_value ); ?&gt;" max="&lt;?php echo esc_attr( $max_value ); ?&gt;" name="&lt;?php echo esc_attr( $input_name ); ?&gt;" value="&lt;?php echo esc_attr( $input_value ); ?&gt;" title="&lt;?php echo esc_attr_x( 'Qty', 'Product quantity input tooltip', 'woocommerce' ) ?&gt;" class="input-text qty text" size="4" /&gt;
   &lt;input type="button" onclick="buttonClick()" value="Increment Value" /&gt;
   &lt;/form&gt;
  &lt;/div&gt;</code></pre>
  </div>
  </div>
  </p>