Date in Javascript Div loop not updating correctly

Question

I'm trying to generate 3 divs in a for loop and insert the datetime in each iteration . The problem I'm running into is while the function generates the three div's correctly it appends the same time to all 3 div's leaving me (JavaScript newbie) to believe the Date() function is only being executed once . If any we could explain to me what is going on I would greatly appreciate it. Ideally I would like to replace the Date function with graph's and have a graph load in each div.

function gengraphs () {
  for (i=0; i < 3; ++i) {
    var divTag = document.createElement("div");
    divTag.style.width ="1000px";
    divTag.style.height ="600px";
    divTag.id = "graph"+i;
    document.body.appendChild(divTag);
    divTag.innerHTML = Date();

    // divTag.appendChild(getGraph(divTag));   
    // divTag.innerHTML = getGraph(divTag);
  }
}

score 0 · Answer 1 · answered Jun 02 '15 at 21:07

0

The server is executing the script fast enough (in milliseconds) that the date() returned is not visibly different. Try something to delay or use the increment variable i

answered Jun 02 '15 at 21:07

Kirk Powell

908
9
14

Also when I uncomment a function that displays a graph in the place of calling Date() it only displays one graph instead of displaying three separate graphs each in its own div – user3666137 Jun 02 '15 at 21:27
http://jsfiddle.net/7fugntds/ Try creating a jsfiddle and work out what is wrong on it. I didn't get any `
` tags when I ran your code?
– Kirk Powell Jun 02 '15 at 21:31
Remove the following two lines and it runs – user3666137 Jun 03 '15 at 15:02
divTag.style.width ="1000px"; divTag.style.height ="600px"; – user3666137 Jun 03 '15 at 15:02

score 0 · Answer 2 · edited May 23 '17 at 12:06

0

The loop is being executed so quickly that you won't see a difference in time. Try calling the contents of your loop with a significant delay (e.g. 1s) and put it into a function as shown here: JavaScript sleep/wait before continuing

edited May 23 '17 at 12:06

Community

1
1

answered Jun 02 '15 at 21:07

SCBuergel

1,613
16
26

Also when I uncomment a function that displays a graph in the place of calling Date() it only displays one graph instead of displaying three separate graphs each in its own div. – user3666137 Jun 02 '15 at 21:10

Date in Javascript Div loop not updating correctly

2 Answers2