Select next Text Box after the value is Entered jQuery

Question

I have an array of

<input type="range"> text boxes.

When the submit is clicked the value of the slider is sent to the select box.

I was wondering if it is possible to select the next box when submit is clicked instead of clicking on the box itself.

here the fiddle

http://jsfiddle.net/salvonostrato/hygc6/

thanks

Answer 1

Remove current clicked class from element and change background color to red then find the next text box. Then add clicked class, then change background color to white.

Just use this piece of code within #ok's click event listener.

    $('.clicked').removeClass('clicked').css({
        background: "red"
    }).next().next('[type=text]').addClass('clicked').css({
        background: "white"
    });

SEE THIS FIDDLE DEMO

UPDATE :

You have a another weapon in your hand. That is, you are using .freqbox class in your all input boxes. So, You can find the last element of .freqboxby .freqbox:last and first element of .freqbox using .freqbox:first.

So, your code will be like this,

if ($('.clicked').is('.freqbox:last')) {
            alert('true');
            $('.clicked').removeClass('clicked').css({
                background: "red"
            }).siblings('.freqbox:first').addClass('clicked').css({
                background: "white"
            });
        } else {
            alert('false');
            $('.clicked').removeClass('clicked').css({
                background: "red"
            }).next().next('[type=text]').addClass('clicked').css({
                background: "white"
            });
        }

SEE THIS UPDATED FIDDLE DEMO