javascript - 从循环中动态填充可折叠 DIV 列表

Question

我正在尝试将带有 JQuery 移动 CSS 的可折叠 DIV 动态添加到页面中。DIV 列表和相关内容填充在 for 循环中。

items.forEach(function (entity) {
  document.getElementById("auditListHolder").innerHTML = document.getElementById("auditListHolder").innerHTML +
    "<div data-role='collapsible' data-collapsed='false'>" +
    "<h3>" + entity.AuditName + "</h3>" +
    "<p>" + entity.Content + "</p>" +
    "</div>";
});

我尝试使用此代码在循环的每次迭代中将 DIV 添加到现有的 DIV 集，但 DIV 不会呈现为可折叠的 DIV。该列表显示为普通 DIV，内容如下所示：

代码有问题还是CSS有问题。

Answer 1

尝试在循环后对元素 auditListHolder 调用 .trigger("create") ！

Answer 2

.collapsible();动态添加元素后调用小部件增强。

$('selector').collapsible();

选择器 = [data-role=collapsible], #id,.class等等...