Alter text field focus order with jQuery

Question

I was wondering, if I have text fields displayed so, could I alter the order in which the focus using javascript (preferably jQuery).

See this example here.

What I mean that when you tab around them, instead on going "one, two, three, four, five" force them to go: "one, two, four, three, five".

Thanks in advance!!

EDIT: Thanks to all, I didn´t know it was possible with HTML only. Of course if this is the case I´ll go with that.

BTW Thanks to all your answers!!! (I`ll upvote the complete ones) but will accept the first one.

Answer 1

No need for jQuery! Check out tabIndex.

Answer 2

Set the tabindex attribute on the elements.

jsfiddle

Answer 3

You can use the tabIndex property to have the order of tabbing as needed: e.g.:

<input type="text" tabIndex=1 value="one"/><br />
<input type="text" tabIndex=2 value="two"/>
<input type="text" tabIndex=4 value="three"/><br />
<input type="text" tabIndex=3 value="four"/>
<input type="text" tabIndex=5 value="five"/>

But if you want to dynamically change the tabbing at client side, you can use jQuery .attr function.

$(<YOUR ELEMENT SELECTOR>).attr("tabIndex", "YOUR_VALUE");