Question

I have this code below…

if (x == 0) {
            $("#scenariotitle").val('');
            $("#scenariosuffix").val('');
}

…which works fine. However, that list will grow to about 5 more jquery selects.

Is there a way to store them into an array and then use the .val(”) function on all the elements in the array? If that is possible, will it be more efficient? Should I just stick to listing them out individually if the list is not greater than 10?

EDIT: I have decided to use this…

$("#scenariotitle, #scenariosuffix, #scenariosuffix, #scenariosuffix").val("");

…which is why I accepted the answer below. However, there is a very good discussion in the comments, and other answers provided, on how to properly use a jquery array selector.

Answer 1

You can concat multiple selectors into one statement:

selector #1, selector #2, selector #3

$("#scenariotitle, #scenariosuffix, #scenariosuffix, #scenariosuffix").val("");

Of course you could use an array but it’s quite pointless in this case:

var selectors = [ "selector #1", "selector #2", "selector #n" ];
for (var i=0; i<selectors.length; i++) {
    $(selectors[i]).val("");
}