Question

Example I had 2 html input

<div class="wrap">        
   <input class="autocomplete" name="auto_1" />
   <input class="autocomplete" name="auto_2" />
</div>

The auto_1 and auto_2 is using auto complete by jQuery UI and triggered when document ready $(function(){})

And then if we click a button on my website, there will be another one button. Added by function $('.wrap').append('<input class="autocomplete" name="auto_3" />')

And now total there will be 3 input

<div class="wrap">        
   <input class="autocomplete" name="auto_1" />
   <input class="autocomplete" name="auto_2" />
   <input class="autocomplete" name="auto_3" />
</div>

But the autocomplete function is not running on auto_3 because it’s newly added.

How to make it running/use autocomplete?

Answer 1

I think the problem is not with click on new input but with autocomplete on new input. When you add new element with

$('.wrap').append('<input class="autocomplete" name="auto_3" />')

You must attach autocomplete to this new field, so

$('input[name="auto_3"]').autocomplete();

Or make autocomplete with livequery plugin: https://stackoverflow.com/a/4551313/657584