JSFiddle - React, Tailwind, and code Playground
HTML
<button id="start">Start</button>
<button id="btn1">1</button>
<button id="btn2">2</button>
<span id="output">Output: </span>
JavaScript
var playback = [{
"time": 1176,
"elemId": "btn1"
}, {
"time": 1554,
"elemId": "btn2"
}]
// Do we assume that the array is in order? If not, we have to re-order it to make sure.
var output = document.getElementById('output');
document.getElementById('btn1').onclick = function () {
output.innerHTML += '1';
}
document.getElementById('btn2').onclick = function () {
output.innerHTML += '2';
}
for (i = 0; i < playback.length; i++) {
play = playback[i];
setTimeout((function (play) {
return function () {
document.getElementById(play.elemId).onclick();
}
})(play), play.time)
}