0

I have the following function:

function render(data){
  nodes = data.nodes;
  for(i=0; i<nodes.length; i++){
    ...
    let originalColor = $("#"+i).css("background-color")
    ...
    setTimeout(()=>{$("#"+i).css("background-color", originalColor)}, 1000)
  }
}

Now, I have tried printing something inside this setTimeout, and it works!, which means it's being actually called, however, the css effect it not working.

Any clues?!

Notes:

  • I am sure the dotted(skipped) code has no effect on the function.
  • I am also sure that the DOM element is being selected correctly.
  • I have tried many stackOverFlow solutions before posting this, non of them seemed to work :(
  • I am sure that the "originalColor is a valid rgb() value.

Full function upon request:

function render(data){
  nodes = data.nodes;
  for(i=0; i<nodes.length; i++){
    $("#"+i).css("background-color", ()=>{
      return nodes[i]["color"]=="Blue"? "dodgerblue" : "red";
    })
    let originalArmies = $("#"+i).text()
    $("#"+i).text(nodes[i]["armies"])
    if(originalArmies != $("#"+i).text()){
      let originalColor = $("#"+i).css("background-color")
      $("#"+i).css("background-color", "yellow")
      setTimeout(()=>{$("#"+i).css("background-color", originalColor)}, 1000)
    }
  }
}
Ahmed Hammad
  • 2,798
  • 4
  • 18
  • 35
  • 1
    Can you post the full code? Don't leave some parts of it out (`originalColor` seems relevant). What exactly do you mean "not working", what happens, is there an error? – CertainPerformance Nov 25 '18 at 23:35
  • @CertainPerformance There's no error, the effect is just not taking place. – Ahmed Hammad Nov 25 '18 at 23:38
  • Have you tried replacying `originalColor` with a literal like `'green'` to make sure that it is actually working as expected? The problem could be with your jquery selector or with `originalColor` and it's important to rule either of them out. – Martin Nov 25 '18 at 23:38
  • @MartinParkin I did, I am sure originalColor is a valid color. – Ahmed Hammad Nov 25 '18 at 23:39
  • 1
    `i` is not the `i` you expect. That's your problem. See the duplicate I've linked. You can easily replicate this by just trying this snippet of code: `for (var i = 0; i < 10; i++) { setTimeout(() => { console.log(i) }) }`. Other than that, your `setTimeout` calls won't execute serially as you probably expect them too, but that's another problem. – nicholaswmin Nov 25 '18 at 23:39
  • @NicholasKyriakides You're right!, I added "let" keyword before the 'i' in the for loop header and it works now. Thank you. – Ahmed Hammad Nov 25 '18 at 23:41

0 Answers0