Javascript 为什么只追加一个div？

我试图动态附加几个div元素。但是，当我去测试代码时，浏览器中只创建/显示了一个div元素。我试图寻找类似的问题，但什么也没找到。任何帮助都将不胜感激

.divcreate {
    height:75px;
    width:75px;
    border:2px solid #000000;
    display:inline-block;
}

$(document).ready(function () {
    for (var i=0; i < 12; i++) {
        $("body").append("<div></div>").addClass('divcreate');
    }
});

.divcreate{
高度：75px；
宽度：75px；
边框：2倍实心#000000；
显示：内联块；
}
$（文档）.ready（函数（）{
对于（变量i=0；i<12；i++）{
$（“body”）.append（“”.addClass（'divcreate'）；
}
});

由于

addClass

函数适用于

主体

选择器，因此代码将添加12个div，但随后将

divcreate

类应用于主体元素。下面是一个简单的工作版本，它将类设置为内联

$（文档）.ready（函数（）{
对于（变量i=0；i<12；i++）{
$（“”）.addClass（'divcreate'）.appendTo（document.body）
}
});
.divcreate{
高度：75px；
宽度：75px；
边框：2倍实心#000000；
显示：内联块；
}
首先添加类，然后追加


$（文档）.ready（函数（）{
对于（变量i=0；i<12；i++）{
$（“body”）。在（$（''）.addClass（'divcreate'）之后；
}
});
.divcreate{
高度：75px；
宽度：75px；
边框：2倍实心#000000；
显示：内联块；
}
您正在将类添加到主体中。如果在div中添加文本，您将看到div实际上被添加了12次。请参阅此jsfiddle
->
$（“”）。addClass（'divcreate'）。appendTo（document.body）
谢谢您的帮助！我没有意识到我是在把这门课应用到身体上。