Can I use a loop to execute the same function call multiple times on incrementing element Id's?

Question

Right now I have 2 functions called showElement (elementId) and hideElement (elementId). I use these to hide and display rows in a table based on what a user clicks.

I have a submit button for an area that takes in about 30 rows and looks like the following function hideGeneralSection { hideElement('gen1'); hideElement('gen2'); hideElement('gen3'); hideElement('gen4'); ... hideElement('gen35'); }

I was content with keeping it like this but then I realized I wanted to add in about 5 sections, each with show and hide for all the rows AND I made two new functions that gray out elements / enable them.

In java for example you can print a string with something that looks like the following: ("showElement('gen%i')",5). Is there anything like that in javascript so that I could just make a loop that spits out showElement('genINTEGER') in 3 lines instead of 30 something each time?

Answer 1

Since your function's argument is a string, you can just concatenate a loop variable on the end of the root "gen" like so:

for (var i = 1; i <= 35; i++) showElement('gen' + i);