title: how to apply auto complete for dynamically created input box
body: <p>I have 5 input box to add product,if user want to add more product he can click on add more product and 5 new dynamically created text box will appear.My problem is i am not  able to give auto complete to my Dynamic input box but not able to give auto complete to my static  input box.  </p>
  
  <p>My HTML CODE </p>
  
  <pre><code>&lt;div class="pro" id="dynamicInput"&gt;
  &lt;div&gt;Product Name 1
  &lt;input style="border:2px solid #7f9db9" name="product_1" id="in_pc_item_moq_unit_type1" class="ui-autocomplete-input" maxlength="100" placeholder="Enter your product name" type="text" autocomplete="off" role="textbox" aria-autocomplete="list" aria-haspopup="true"&gt;
  &lt;input type="hidden" id="in_pc_item_moq_1"&gt;
  &lt;/div&gt;
  &lt;div&gt;Product Name 2
  
  &lt;input style="border:2px solid #7f9db9" name="product_2" id="in_pc_item_moq_unit_type2" class="ui-autocomplete-input" maxlength="100" placeholder="Enter your product name" type="text" autocomplete="off" role="textbox" aria-autocomplete="list" aria-haspopup="true"&gt;
  &lt;/div&gt;
  &lt;div&gt;Product Name 3
  &lt;input style="border:2px solid #7f9db9" class="ui-autocomplete-input" id="in_pc_item_moq_unit_type3" maxlength="100" name="product_3" placeholder="Enter your product name" type="text" autocomplete="off" role="textbox" aria-autocomplete="list" aria-haspopup="true"&gt;
  &lt;/div&gt;
  &lt;div&gt;Product Name 4
  
     &lt;input style="border:2px solid #7f9db9" class="ui-autocomplete-input" id="in_pc_item_moq_unit_type4" maxlength="100" name="product_4" placeholder="Enter your product name" type="text" autocomplete="off" role="textbox" aria-autocomplete="list" aria-haspopup="true"&gt;
  &lt;/div&gt;
   &lt;div&gt;Product Name 5
  
     &lt;input style="border:2px solid #7f9db9" class="ui-autocomplete-input" id="in_pc_item_moq_unit_type5" maxlength="100" name="product_5" placeholder="Enter your product name" type="text" autocomplete="off" role="textbox" aria-autocomplete="list" aria-haspopup="true"&gt;
   &lt;/div&gt;
              &lt;/div&gt;
  &lt;div class="ta m15"&gt;
      &lt;input name="gluserid" id="glid" value="7171786" type="hidden"&gt;     &lt;input type="button" value="Add more product"  onclick="addInput('dynamicInput');"&gt;
       &lt;input type="submit" value="submit"  name="submit"&gt;
  
  
          &lt;/div&gt;
  </code></pre>
  
  <p>My java script code for dynamically add inputbox is</p>
  
  <pre><code>&lt;script type="text/javascript"&gt;
  
          var counter = 1;
          var limit = 4;
          var num=6;
  function addInput(divName){
       if (counter == limit)  {
            alert("You have reached the limit of adding " + counter + " inputs");
       }
       else {
           for(var i=1;i&lt;=5;i++)
           {
            var newdiv = document.createElement('div');
            newdiv.innerHTML = "Product Name " + (num) + "&lt;input style='border:2px solid #7f9db9'  class='ui-autocomplete-input' id='in_pc_item_moq_unit_type" + num + "' maxlength='100' type='text' name='product_" + num + "' placeholder='Enter your product name'&gt;";
            document.getElementById(divName).appendChild(newdiv);
            num++
        }
      counter++;
       }
  }
  
      &lt;/script&gt;
  </code></pre>
  
  <p>My script for auto suggest is</p>
  
  <pre><code>&lt;script type="text/javascript"&gt;
  
      function auto_suggest(id)
      {
          if(typeof(Suggester)!="undefined")
          {
              sugg=new Suggester({"element":id,"onSelect":selecttext,"type":"mcat","placeholder":"Enter your product name","classPlaceholder":"ui-placeholder-input",minStringLengthToFetchSuggestion:1});
          }else
          {
              setTimeout(function(){
              auto_suggest()},50);
          }
      }
          auto_suggest('in_pc_item_moq_unit_type1');
          auto_suggest('in_pc_item_moq_unit_type2');
          auto_suggest('in_pc_item_moq_unit_type3');
          auto_suggest('in_pc_item_moq_unit_type4');
          auto_suggest('in_pc_item_moq_unit_type5');
          auto_suggest('in_pc_item_moq_unit_type6');
          auto_suggest('in_pc_item_moq_unit_type7');
          auto_suggest('in_pc_item_moq_unit_type8');
          auto_suggest('in_pc_item_moq_unit_type9');
          auto_suggest('in_pc_item_moq_unit_type10');
          auto_suggest('in_pc_item_moq_unit_type11');
          auto_suggest('in_pc_item_moq_unit_type12');
          auto_suggest('in_pc_item_moq_unit_type13');
          auto_suggest('in_pc_item_moq_unit_type14');
          auto_suggest('in_pc_item_moq_unit_type15');
          auto_suggest('in_pc_item_moq_unit_type16');
          auto_suggest('in_pc_item_moq_unit_type17');
          auto_suggest('in_pc_item_moq_unit_type18');
          auto_suggest('in_pc_item_moq_unit_type19');
          auto_suggest('in_pc_item_moq_unit_type20');
  
  
  
      function selecttext(event, ui)
      {
          this.value = ui.item.value;
  
  
  
      }
  
  &lt;/script&gt;
  </code></pre>
  
  <p>Can anyone tell me what i am doing wrong,Thanks in advance</p>