在动态创建表行后应用Bootstrap“table-striped”

我正在尝试确保将Twitter Bootstrap table-stripped CSS样式应用于在运行时动态添加行的表。出于某种原因，我正试图找到底线，我无法使这种特殊的风格起作用，以便我的新行采用剥离外观进行样式设置。

所以如果我有这个包含table-stripped HTML：

    Heading A  Heading B  Heading C

然后我运行这个JavaScript代码：

 for (var i = 0; i  tbody:last').before('' + i +'bc'); }

我将获得我的5个新行，但它们不会应用table-stripped样式。

即使我在使用它创建后手动添加类也没有区别。

 $('#table2').addClass('table-hover');

我已经创建了一个jsFiddle示例，因此您可以看到它正在运行。

你应该使用append to tbody而不是之前。现在的方式，行被添加到tbody之外。

改变这一行：

 $('#table2 > tbody:last').append('' + i +'bc');

似乎让你的jsFiddle工作。

将.append()更改为

并修复丢失的结束。

演示

 $('#table2 > tbody').append('' + i +'bc');

通过使用.before()您在tbody之前插入了行，导致样式不被应用，因为Bootstrap样式的目标行是tbody的子行。