CSS：nth-​​child（偶数）选择器背景颜色不起作用

Question

我正在尝试使用:nth-child(even)在两行上均匀显示背景颜色并且它不起作用，但它适用于jsfiddle.net（没有javascript来生成表格）。

在调用JSON文件后生成一个表 -

$(document).ready(function() {
    $.getJSON("js/dataPokerPlayers.json", function(data) {
        $.each(data, function(i, data){
            $(".tableData tbody").append("<tr><td class=\"centertext\">" + data.rank + "</td><td>" + data.name + "</td><td class=\"centertext\">" + data.earnings + "</td><td class=\"centertext\">" + data.points + "</td><td class=\"centertext\">" + data.totalearnings + "</td></tr>");
        });
    });
});

CSS

.tableData tbody tr:nth-child(even) {
    background-color:#212121;
}

HTML

<table class="tableData">
    <thead>
        <tr>
        <th>Rank</th>
        <th width="250">Name</th>
        <th>Earnings</th>
        <th>Points</th>
        <th>Total Earnings</th>
        </tr>
    </thead>
    <tbody></tbody>
</table>

Answer 1

以下CSS代码可以使用。

.tableData > tbody > tr:nth-child(2n) {
background-color:#212121;}