title: Validating multiple inputs with the same ID
body: <p>I'm developing a "Order by SKU" system in one of my magento stores. It's a simple input of the SKU and Qty desired.</p>
  
  <p>I threw a "add another sku" option in there with the following function:</p>
  
  <pre><code>function adicionarCampos(){
      var str = $('tabs-wrapper-cod').insert( '&lt;div class="enc-cod-tab"&gt;&lt;span class="enc_cod_02_home"&gt;Código: &lt;input type="text" name="cod[]" value="" class="form_carrinho_cod required-entry" /&gt;&lt;/span&gt;&lt;span class="enc_cod_04_home"&gt;Qt: &lt;input type="text" name="qt[]" value="" class="form_carrinho_qt required-entry validate-number" /&gt;&lt;/span&gt;&lt;/div&gt;' );
  }
  </code></pre>
  
  <p>This function adds a another "tab" for the user to input another SKU. Here's the main file for reference:</p>
  
  <pre><code>&lt;div id="enc-cod-conteudo" title="Encomendar por código"&gt;
      &lt;div class="enc-por-codigo"&gt;
          &lt;p class="sub-enc-cod"&gt;Nunca foi tão simples encomendar por código!&lt;/p&gt;
          &lt;div class="quick-order"&gt;
              &lt;form action="&lt;?php echo htmlspecialchars($_SERVER["PHP_SELF"]);?&gt;" method="POST"&gt;
                  &lt;div id="tabs-wrapper-cod"&gt;
                      &lt;div class="enc-cod-tab"&gt;&lt;span class="enc_cod_02_home"&gt;Código: &lt;input type="text" name="cod[]" value="" class="form_carrinho_cod required-entry" /&gt;&lt;/span&gt;&lt;span class="enc_cod_04_home"&gt;Qt: &lt;input type="text" name="qt[]" value="" class="form_carrinho_qt required-entry validate-number" /&gt;&lt;/span&gt;&lt;/div
                  &lt;/div&gt;
          &lt;/div&gt;
          &lt;div class="actions_carrinho"&gt;
              &lt;div class="adicionar-cod" onclick="adicionarCampos();"&gt;&lt;span&gt;Adicionar código&lt;/span&gt;&lt;/div&gt;
              &lt;button style="padding-left: 6px;" type="submit" title="Adicionar" class="button btn-update"&gt;&lt;span&gt;&lt;span&gt;Adicionar ao carrinho&lt;/span&gt;&lt;/span&gt;&lt;/button&gt;
          &lt;/div&gt;
          &lt;/form&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>As you see, the added inputs will have the same ID, "sku". Which is what the validation script is looking for, as you can see here:</p>
  
  <pre><code>jQuery(document).ready(function(){
  jQuery('#sku').keyup(sku_check);
  });
  
  function sku_check(){   
  var sku = jQuery('#sku').val();
  if(sku == "" || sku.length &lt; 7){
  jQuery('#sku').css('border', '1px #CCC solid');
  jQuery('#tick').hide();
  jQuery('#nome_do_produto').hide();
  } else {
  jQuery.ajax({
     type: "POST",
     url: "scripts/verificar_cod.php",
     data: 'sku='+ sku,
     cache: false,
     success: function(response){
  if(response.length &gt; 0){
      console.log(response);
      jQuery('#sku').css('border', '1px #090 solid');
      jQuery('#tick').fadeIn();
      jQuery('#cross').hide();
      jQuery('#nome_do_produto').html(response);
      jQuery('#nome_do_produto').fadeIn();
      jQuery('#codigo_inexistente').hide();
      } else {
      jQuery('#sku').css('border', '1px #C33 solid');
      jQuery('#cross').fadeIn();
      jQuery('#tick').hide();
      jQuery('#nome_do_produto').hide();
      jQuery('#codigo_inexistente').fadeIn();
           }
      }
      });
  }
  }
  </code></pre>
  
  <p>Now, I know this ain't the right way to do it (IDs should be unique by essence), but javascript isnt my "beach" so to speak and I'm stuck on how I will give the add inputs an unique ID, plus, the validation script would have to look for all those incremented IDs.</p>
  
  <p>My question is, what's the best way to approach such a problem? Should I be looking into incrementation through javascript? If so, how?</p>