Javascript 使用java脚本动态创建一个div并在所创建的div内追加一个div列表

通过java脚本，我必须创建一个div。在该div中，我必须附加一个动态加载的div列表，以便为父级创建的div应用一个边框。 例如：。如果我动态加载了10个div，我必须为每3个div创建一个父div，这样我就可以为3个div的父div应用一个边框

<div class="main">
    <div class="div_item">
        item 1
    </div>
    <div class="div_item">
        item 2
    </div>
    <div class="div_item">
        item 3
    </div>
    <div class="div_item">
        item 4
    </div>
    <div class="div_item">
        item 5
    </div>
    <div class="div_item">
        item 6
    </div>
    <div class="div_item">
        item 7
    </div>
    <div class="div_item">
        item 8
    </div>
</div>

---

对于这些项目列表，我必须为每3个div创建一个父div。有人能帮我找到解决方案吗？

如果您有一个元素容器，可以使用jQuery append函数将元素附加到容器中。在元素上做一个循环，并将它们分成3组

var nodes = 21; // total number of nodes

for (var i=0; i<nodes; i++)
{
    if(i%3==0) {
        $('#container').append('<div class="parent"></div>');
    }

    $('.parent').last().append('<div class="child">child '+ i +'</div>');
}

---

这里有问题吗？嗨，埃文，谢谢你通知我。我已经编辑了这个问题。你能认识到这个问题吗？或者你需要更多的关注这个问题。所以，给定一定数量的div，你需要将它们分成3组？div是如何加载的？是的，Evan。Giorgio，div正在动态加载。我无法控制它。我只需要将每3个div封装在一个新创建的div中。

// Create array (can be made with data load from backend)
var total = 21;
var nodes = new Array();

for (var i=0; i<total; i++)
{
    var desc = "child" + i;
    var node = {id:i, description:desc};
    nodes.push(node);
}

// Output results
for (i=0; i<nodes.length; i++)
{
    if(i%3==0) {
        $('#container').append('<div class="parent"></div>');
    }

    $('.parent').last().append('<div class="child">'+ nodes[i].description +'</div>');
}