Javascript to focus on the next input field

Question

I can't get this to work, please help. I have a table where each TD has an input text field. I want that after the user press one letter, the focus goes to the next input text field in the next TD. My code it's not working... I'm using primefaces:

<p:inputText value="#{officialVar.officialAnswer}"
    id="officialAnswer" maxlength="1"
    onblur="value=value.toUpperCase()"
    onkeyup="$(this).next('input').focus();" />

I have issued some alerts in the onkeyup and here are the results:

alert($(this));
    [object Object]
alert($(this).value);
    undefined
alert($(this).next('input'))
    [object Object]

How can I accomplish this?

Thanks

EDIT: if I had 2 fields in the same TD, it would work.

Answer 1

Yes it won't work because all the <input> are not siblings but their parent <td>s are. See the next() API docs. When you use next() you are referring to the immediate following sibling of the element.

This should work:

onkeyup="$(this).parent('td').next('td').find('input').focus();"