title: Autocomplete not working when cloning an input field
body: <p>I'm cloning input fields on a table that have an autocomplete class. When I clone the fields I have no problem. The problem is that in the cloned fields, the autocomplete doesnt work (on the one that is not cloned it does work). My autocomplete code is this:</p>
  
  <pre><code>$(document).ready(function() {
          $('#btnAdd').click(function() {
              var num     = $('.clonedInput').length; // how many "duplicatable" input fields we currently have
              var newNum  = new Number(num + 1);      // the numeric ID of the new input field being added
  
              // create the new element via clone(), and manipulate it's ID using newNum value
              var newElem = $('#input' + num).clone().prop('id', 'input' + newNum);
  
  
             newElem.find(':input').each(function() {
            var name = $(this).attr('name').replace(/\d+$/, '');
  
              $(this).prop({id: name + newNum, name: name + newNum}).val("");
  
  
          });             
  
              // insert the new element after the last "duplicatable" input field
              $('#input' + num).after(newElem);
  
              // enable the "remove" button
              $('#btnDel').prop('disabled','');
  
              // business rule: you can only add 15 names
              if (newNum == 15)
                  $('#btnAdd').prop('disabled','disabled');
          });
  
          $('#btnDel').click(function() {
              var num = $('.clonedInput').length; // how many "duplicatable" input fields we currently have
              $('#input' + num).remove();     // remove the last element
  
              // enable the "add" button
              $('#btnAdd').prop('disabled','');
  
              // if only one element remains, disable the "remove" button
              if (num-1 == 1)
                  $('#btnDel').prop('disabled','disabled');
          });
  
          $('#btnDel').prop('disabled','disabled');
      });
  </code></pre>
  
  <p>My Autocomplete code is :</p>
  
  <pre><code>var autoc = {
          source: "lib/search.php",
          minLength: 1,
          select: function( event, ui ) {
              log( ui.item ?
                  "Selected: " + ui.item.value + " aka " + ui.item.id :
                  "Nothing selected, input was " + this.value );
                      }   
                  };
  
                  var renderItem = function( ul, item ) {
                        return $( "&lt;li&gt;&lt;/li&gt;" )
                    .data( "item.autocomplete", item )
                     .append( "&lt;a style='height:75px; text-align:center; font-weight:bold;'&gt;"+ item.label + "&lt;/a&gt;" )
                     .appendTo( ul );
                 };   
  
                 $(".member").each(function (i) {
                  $(this).autocomplete(autoc).data("autocomplete")._renderItem = renderItem;
          });
  </code></pre>
  
  <p>I've been trying to fix it by putting the autocomplete code inside of the clone code, Im not sure what Im doing wrong. It would be great if somebody could help! Thanks!</p>