'How to fix setTimeout() when appending to document

So I have a thing to show when a user is typing in my website but I want the typing... to show the dots slower rather than instantly right now I have my current code which works perfectly which is great just it sends the .. and turns it into ... instantly but I'd like to add a like timeout somehow.

var countTyping = 0;

function typingAnimation() {
let items = ['.', '..', '...'];
//return items[Math.floor(Math.random() * items.length)];
//return items[countTyping]; dont use
if (countTyping < 2) {//if the count is less than 2
  countTyping++
  return items[countTyping]
}
  else {
    countTyping = 0
    return items[countTyping];
  }
}

later on I have

'user is typing' + typingAnimation()

in my code which is appended to the document so I can't use a setTimeout(typingAnimation, 1000) or anything or it would show random numbers.



Solution 1:[1]

My fix was to add more elements to the array but there are lot more options but this is easiest and quick find for me.

let items = ['.', '.', '..', '..', '...', '...'];

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 moie