title: php Jquery Ajax autocomplete for dynamicaly added textbox
body: <p>I haw a webform where one field in each row of a table has a Jquery AutoComplete function and this works fine.
  I also add rows to this table dynamically with a ajax call.
  the problem is I can't seem to get the autocomplete to work on the dynamically added row(textBox).
  Based on google "all" i need to do is add the .autocomplete to the added field. I haw tried different variants of this and it seems that jquery cant find the field to add it?</p>
  
  <p>Add row code:</p>
  
  <pre><code>$(".btnAddRow").click(function(){
  var count = $(this).closest('.AgensDiv').children('.count').val();
  var tab = $(this).closest('tr').find('.tab').val();
  
  count++;
  
  $.ajax({
      url: "tblRow.php", 
      type: "POST",
      dataType: "HTML",
      data: {"count": count,
          "tab": tab},
      success: function(result){
          //console.log(result);  
          $("#agensTbl tr:last").before(result);
  
      }});    
  $(this).closest('.AgensDiv').children('.count').val(count);             
  });
  </code></pre>
  
  <p>Autocomplete code:</p>
  
  <pre><code>$(".legemiddel" ).autocomplete({
  source: function( request, response ) {
      $.ajax({
          url: "AgensSok.php",
          type: "POST",
          dataType: "json",
          data: {"Virkestoff": request.term},
          success: function(data){
              response(data);
              //console.log(data);
          },
          error: function(error){
               console.log("Error:");
               console.log(error);
          }
      });
  },
  minLength: 3,
  select: function( event, ui ) {
      $(this).closest('tr').find('.atc').val(ui.item.id);
      //$("#testAjax").val(ui.item.id);
   },
   open: function() {
     $( this ).removeClass( "ui-corner-all" ).addClass( "ui-corner-top" );
   },
   close: function() {
     $( this ).removeClass( "ui-corner-top" ).addClass( "ui-corner-all" );
   }
  });
  </code></pre>
  
  <p>tried different variants of adding the autocomplete or just changing the value of the textbox in the newly added row</p>
  
  <pre><code>$("#agensTbl tr:last").prev().find(".legemiddel").val("popp");
  </code></pre>
  
  <p>changes the value of the row before the newly added on and </p>
  
  <pre><code>$("#agensTbl tr:last").find(".legemiddel").val("popp");
  </code></pre>
  
  <p>does not work
  haw tried adding the autocomplete code but I am guessing the problem is accessing the newly added row.
  also tried giving the new textbox a uniqe ID just to test. with no success.</p>
  
  <p>So how do I access the added rows members?
  or is there a way to add the autocomplete to a higher level? (document.body) alle the textBoxes that I wish to use autoComplete on haw the class "legemiddel"</p>