jQuery autocomplete UI Widget- Perform jQuery select event on dynamically created table row element

I have a working jQuery autocomplete being performed on the text input of a table data element, txtRow1. The text data is remote, from a mysql database, and is returned by JSON as 'value' for the text input. The returned data includes another piece of text, which, via a select event within the autocomplete, is populated to the开发者_运维百科 adjacent table data element tickerRow1.

With help from the SO community, the autocomplete is now live and working on all text input elements of a dynamically created table (so txtRow1 to txtRowN). There is javascript code to create and name the table elements txtRoxN + 1 and tickerRowN + 1.

However, I have a problem with the select event for the id of tickerRowN. Because it changes every time I add a row, I don't know how to call the select event for the specific id of the table data in question.

I have done a lot of searching around but as I am new to this, the only functions I have been able to find manipulate the element data when you know the id already. This id is dynamically created and so I don't know how to build the syntax.

Thankyou for your time.

UPDATE: with huge thanks to JK, the following example works. I now know about jsFiddle and will try to use this for all further questions. The following code works for my dynamic example, but I don't know why. Sigh.

jsFiddle working example

---

function getRowId(acInput){
     //set prefix, get row number
     var rowPrefix = 'txtRow';
     var rowNum = acInput.attr("id").substring((rowPrefix.length));
     return rowNum;
}

$("#txtRow1").autocomplete({
    source: states,
    minLength: 2,
    select: function(event, ui) {
       var tickerRow = "#tickerRow" + getRowId($(this));
        //set ticker input
        $(tickerRow).val(ui.item.label);
    }
});

http://jsfiddle.net/jensbits/BjqNz/