当单选按钮在 Jquery mobile 中处于活动状态时，单选按钮上有不同的颜色

我有三个单选按钮，它们在 jquery 中具有相同的主题。如果我选择其中之一，按钮的颜色将更改为 css 中的 .ui-btn-active 类中指定的颜色。我的单选按钮名为“可以见面”、“不确定”和“拒绝”。我希望“拒绝”单选按钮在被选中时具有与其他两个按钮不同的颜色（红色）。

我正在使用 Jquery mobile 并自定义了我想要在不同主题上使用的颜色的 css，并且我已将 .ui-btn-active 更改为 .ui-btn-active-a 和 .ui-btn-active- b 并使它们具有不同的值。我尝试在两个 ui-btn-active 类之间切换，但没有运气，并且尝试了 addClass(..) 和 removeClass(..) ，但没有运气。我在 jquery-mobile.js 中创建了一个方法，如下所示：

 $.mobile.changeAction = function( activeBtn){
    $.mobile.activeBtnClass = activeBtn;
} 

其中我的 activeBtn 参数将是一个字符串，用于选择我想要的 activeBtnClass 。我认为问题是我在重写 activeBtnClass 后刷新它时遇到问题，我尝试了一些刷新方法但没有成功。

只要单选按钮在活动时具有不同的颜色，我就会非常感激。

Following styles should do the trick:

.ui-radio:nth-child(1) .ui-icon-radio-on.ui-icon{
    background-color:green;
}
.ui-radio:nth-child(2) .ui-icon-radio-on.ui-icon{
    background-color:grey;
}
.ui-radio:nth-child(3) .ui-icon-radio-on.ui-icon{
    background-color:red;
}​

Sample jsfiddle http://jsfiddle.net/nirmaljpatel/EAGgm/.

要设置水平堆叠的样式，请选择选项：

.ui-radio:nth-child(1) .ui-radio-on span.ui-btn-inner{
    background-color:green;
}
.ui-radio:nth-child(2) .ui-radio-on span.ui-btn-inner{
    background-color:grey;
}
.ui-radio:nth-child(3) .ui-radio-on span.ui-btn-inner{
    background-color:red;
}​

Sample jsfiddle http://jsfiddle.net/EAGgm/19/.