Focus next element on keypress It's been a year or two since I last dabbled in jQuery and have attempted to write a simple "on key press move to the next element" script.  However my first attempt has a lot a repetition. I just know there is a more elegant way to write this, probably using a dictionary of elements or such.





$("#DialFirst").keypress(function () {
        $("#DialSecond").focus();
    });

    $("#DialSecond").keypress(function () {
        $("#DialThird").focus();
    });

    $("#DialThird").keypress(function () {
        $("#DialFourth").focus();
    });

    $("#DialFourth").keypress(function () {
        $("#DialFifth").focus();
    });
&lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"&gt;&lt;/script&gt;
&lt;input id="DialFirst" name="DialFirst" type="text" value="" /&gt;
&lt;input id="DialSecond" name="DialSecond" type="text" value="" /&gt;
&lt;input id="DialThird" name="DialThird" type="text" value="" /&gt;
&lt;input id="DialFourth" name="DialFourth" type="text" value="" /&gt;
&lt;input id="DialFifth" name="DialFifth" type="text" value="" /&gt;




Usage: Type in each box, focus should move to the next.
The input elements are all siblings of each other, so you can use $.next() to select the next one that appears after the event target.  There is no need to name each input individually.



$(':input').keypress(function() {
    $(this).next(':input').focus();
});
&lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"&gt;&lt;/script&gt;
&lt;input placeholder="1"&gt;
&lt;input placeholder="2"&gt;
&lt;input placeholder="3"&gt;
&lt;input placeholder="4"&gt;
&lt;input placeholder="5"&gt;