如何将CSS类移动到正确的html元素

我尝试了一些XSLT和XSLTForms的东西，我遇到了一个特殊的问题。 我想为某些xforms:trigger添加样式，但我使用的XForms实现（ XSLTForms ）将以下简单的xforms代码转换为这些html元素：

    *    

这是实际的XForms代码。

  /  

因此，当它转换为html元素时，结构就是

 |_span |_span |_button |_span (for the label) 

所以，我希望这个按钮由twitter的bootstrap设置为btn-warning css规则。 但是在最后的html中，css类class="btn btn-warning"被插入到第一个span元素中，该元素包含一个button元素。 所以我得到了两个按钮 – 彼此在一起……

理想情况下，我想将class="btn btn-warning"从 element to the它应该实际属于 element to the元素。 让我们说jQuery的最佳方法是什么？

所以期望的结果应该是：

    *    

Answer 1

使用jQuery很简单：

 $(function () { $("span.btn").each(function () { var cssClasses = this.className.split(" "), i; for (i = 0; i < cssClasses.length; i++) { // remove any class that does not start with "btn" from the array if (cssClasses[i].indexOf("btn") === -1) { cssClasses.splice(i, 1); } } cssClasses = cssClasses.join(" "); // transfer remaining classes from this to the inner  $(this) .removeClass(cssClasses) .find("button").addClass(cssClasses); }); });