我使用：after来显示标题图标，一切都很简单，除非我想在它们之间切换。我做了这个小提琴：http://jsfiddle.net/73C9v/
因为stackoverflow希望我这样做，也因为这是唯一的自定义代码：

.accordion-toggle:after {
    content: 'ON';
}
.accordion-toggle.collapsed:after {
    content: 'OFF';
}

当你点击其中一个，然后打开另一个时，你可以看到这个问题。通过点击另一个 accordion 。后面的：不会改变，这意味着如果我有图标，它们不会改变。
什么是最好的方法呢？我还没有看到使用：before/：after时出现这样的问题，所以我正在寻找一个尽可能优雅的解决方案。
E：我使用的是Bootstrap v2.3.2