using autocomplete on cloned elements

using autocomplete on cloned elements

Hi Guys,

Had an issue that I could never find the correct solution online for so thought I would post one up in case it would ever help anyone.
So basically I wanted to add the same autocomplete function to multiple cloned elements, but as anyone that has tried this before knows, there are tonnes of issues meaning it never works without complications. I've came up with a few solutions, (new ids, add to each new id) but by far my favorite is shown below:

$("[name='nameofelement']")
.focus(function(){
      //Don't really need this if statement but it may improve performance
if($(this).hasClass("ui-autocomplete-input") !== true){
            //add the autocomplete function when input needs it
$(this).autocomplete({
                        // source is hardcoded but cant use remote as shown in jquery documentation
source: ["complete 1", "complete 2", "complete 3"]
});
}
})
.focusout(function(){
if($(this).hasClass("ui-autocomplete-input") === true){
                 //Remove autocomplete function when the input no longer needs it
$(this).autocomplete( "destroy" );
}
});

Hope this helps someone someday