Javascript 第n个子项不处理动态生成的DOM

我在CSS中使用第n个child时遇到问题（到目前为止已经在Chrome和Firefox中试用过）。部分DOM是使用普通DOM操作方法（document.createElement、document.appendChild等）在客户端动态生成的

我使用的CSS和生成的DOM如下所示：

CSS:

DOM:

---

我想你要找的是

：第n个孩子（2n+1）

选择器

例如：

---

您还可以通过使用

：n个子项（奇数）

或

：n个子项（偶数）

来简化此过程。只需使用

：nth child（number）

选择器，您只需按照节点列表顺序寻址该索引。

那么，DOM操作在哪里？您可以显示您的DOM操作吗？最好是在我工作的地方@IanClark OP确实提到它在fiddle中工作得很好。@karthikr不，他说“我已经尝试将这个HTML和CSS放到JSFIDLE中了”，他没有说动态地将它插入DOM。这并不能完全解决我的问题，因为我无法发布准确的代码，但足够的信息让我走上正确的道路。我想我需要重温一下我对N个孩子到底是如何工作的理解。。。谢谢看看这里，交互式测试仪的优秀示例：

#loginForm label {
    color: #FF0000
}

#loginForm label:nth-child(1) {
    color: #8a8a8a;
}

<div id="loginForm">
    <form>
        <label>Label 1</label>
        <label>Label 2</label>
    </form>
</div>

var contentHolder = document.createElement("div");
var form = document.createElement("form");
var userLabel = document.createElement("label");

form.appendChild(userLabel);
contentHolder.appendChild(form);
document.getElementById(target).appendChild(contentHolder);