管理在 JavaScript 中的动态元素中制作的计时器

Question

实际上，我正在通过 AJAX 从数据库中检索一些数据，在检索数据时，我使用 JavaScript 在 HTML 中制作了一些动态元素。我在容器中创建了动态行，在该行中我创建了一个动态 div，其类为“col-md-4”，它是父行的子行，这意味着至少可以有 3 个动态 div 的 class="col-md- 4" 动态行。为此，在 AJAX 的 obj.success 函数中使用了一个循环。使用循环在动态行中制作 3 个动态元素的目的。如果不使用循环，那么新行将只有一个 col-md-4 类的 div。现在的问题是我从数据库中检索一些时间，然后使用当前时间我得到两个 tme 的差异，然后使用一个函数来运行时间。这一切都是循环。现在的问题是计时器仅针对行中的最后一个元素运行。我在另一个场景中使用了计时器，但是没有问题，因为在那个场景中没有使用循环。var ajax = prompt('Confirm demo or paste AJAX data', '[ {"id":1}, {"id":2}, {"id":3}, {"id":4}, {"id":5}]');display(ajax);function display(response) {    var n=1;    var times = ["2019-09-19 12:59","2019-09-27 12:59","2019-12-19 12:59","2019-11-19 12:59","2019-10-19 12:59"];    var time=new Date().toLocaleTimeString('en-GB');           var res = time.slice(0,-3);    var today = new Date();        var dd = String(today.getDate()).padStart(2, '0');        var mm = String(today.getMonth() + 1).padStart(2, '0');         var yyyy = today.getFullYear();        today = yyyy + '-' + mm + '-' + dd;        var current=today+" "+res;      //  alert(current);    var data = JSON.parse(response);    if(data.length) {        for(var i=0;i<data.length;i++) {            var parent= document.getElementsByClassName('carousel')[0];            var row1= document.createElement("div");            row1.setAttribute("class", "row");            row1.setAttribute("id", "row"+n);            parent.appendChild(row1);            var crow1;            for(var j=0;j<3 && i+j < data.length;j++) {              crow1 = document.createElement("div");              crow1.setAttribute("class", "col-md-4");              crow1.setAttribute("id", data[i+j].id);                }            }, 1000);            }            i += 3-1;            n++;        }    }}DIV.col-md-4 {  display: inline;  background-color: #FF0080;  margin: 5px;}.row {  display: block;  background-color: #80E080;  padding: 3px;}<div class="carousel"></div>为什么只有最后一个元素显示计时器？