Select multiple elements with nth-child

JavaScript
1

Tell us what’s happening:
Why is the .nth-child not working and showing a syntax error, I want to select 4 elements at a time so I created this code with functions. Can anyone explain it to me?
Thank you


function loadAnimation(){
  elementsColorChange(1,4);
  for(let i=0;i<9;i+4){
  setTimeout(function(){
    elementsColorChange(5+i,8+i);
  },1000);
}
  setTimeout(function(){
    elementsColorChange(17,18);
  },1000);
}


function elementsColorChange(first, last){
  for(let i=first;i<=last;i++){
    $(".boxes:nth-child(i)").addClass("colorChange");
  }
}
2

I’ve edited your post for readability. When you enter a code block into a forum post, please precede it with a separate line of three backticks and follow it with a separate line of three backticks to make easier to read.

See this post to find the backtick on your keyboard. The “preformatted text” tool in the editor (</>) will also add backticks around text.

Note: Backticks are not single quotes.

markdown_Forums

3

$(".boxes:nth-child(i)").addClass("colorChange");
The i in nth-child(i) is just the letter “i” in a string (just like the “i” in “child”). It isn’t being treated as a variable.

4

How do I treat it as a variable? It’s not even a string

5

How have you combined variable values with strings before?

1 Like
6

Thanks this helped! i didn’t actually see that it’s all a string. Simply concatenated it with the string.

7

Good job! Happy coding.