Javascript - Appending for loop index to a variable inside loop

Question

I'm trying to target a list of elements using a for loop:

for(var i = 1; i < 5; ++i){
    console.log(i)
    target[i].classList.remove('redText')
    anchor[i].classList.remove('redText')
}

The expected result is:

target1.classList.remove('redText')
anchor1.classList.remove('redText')
target2.classList.remove('redText')
anchor2.classList.remove('redText')

....etc.

in the console I get

ReferenceError: target is not defined

Which means the index is not being appended to target and anchor.

Is this possible to accomplish?

Makes sure target is referencing a collection of DOM elements or make sure target is declared in your code. — Akinkunle Allen
– Akinkunle Allen, Commented Apr 16, 2014 at 0:22
Not an expert here, but aren't you lacking the initialization of the target array? — Code Grasshopper
– Code Grasshopper, Commented Apr 16, 2014 at 0:22
Sorry, I left that part out. They are element ids... I'm using a templating engine on the back end so the way they are defined might be a little confusing for this question. — Christopher Reid
– Christopher Reid, Commented Apr 16, 2014 at 0:26

net.uk.sweet · Accepted Answer · 2014-04-16 00:35:44Z

2

This is what you're looking for:

for(var i = 1; i < 5; ++i){
    console.log(i)
    document.getElementById('target' + i).classList.remove('redText')
    document.getElementById('anchor' + i).classList.remove('redText')
}

Fiddle.

edited Apr 16, 2014 at 0:35

answered Apr 16, 2014 at 0:24

net.uk.sweet

12.4k3 gold badges26 silver badges42 bronze badges

Sign up to request clarification or add additional context in comments.

4 Comments

Christopher Reid Over a year ago

I'm assuming this would have worked in normal circumstances. But I realize now my question is misleading because my logic is linked to elements being generated by a back-end templating engine. I found a solution, but it's outside the scope of this question.

net.uk.sweet Over a year ago

How does the way the HTML is generated affect things?

bsoist Over a year ago

@AllTheTime your question was very specific and this is the right answer to the question you asked. Certainly should be selected as the answer.

Christopher Reid Over a year ago

@net.uk.sweet well what I meant was that your solution didn't work in my circumstances. The element id's being targeted were generated by a for loop within the template engine so target1 target2 etc. don't actually exist when the javascript loop run. But your answer is obviously useful and correct, so I will accept it. Sorry for the confusion.

Collectives™ on Stack Overflow

Javascript - Appending for loop index to a variable inside loop

1 Answer 1

4 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

4 Comments

Your Answer

Sign up or log in

Post as a guest

Related