如何在选中时更改背景单选按钮

Question

我希望您帮助我在选择时如何更改按钮收音机的颜色。我的代码将有各种按钮，所以当选择另一个时，已经标记的内容必须继续，如何使用jquery或JavaScript执行此操作？

.HTML：

 <div class="row form-group">
                <div class="col-md-8">
                    <div class="btn" data-toggle="buttons">
                        <label class="btn btn-default">
                            <input type="radio" name="motSolic" id="motNovaFuncao" value=3 autocomplete=off> Nova Função
                        </label>
                        <label class="btn btn-default">
                            <input type="radio" name="motSolic" id="motRemanejamento" value=4 autocomplete=off> Remanejamento
                        </label>
                        <label class="btn btn-default">
                            <input type="radio" name="motSolic" id="motAumentoQuadro" value=5 autocomplete=off> Aumento de Quadro
                        </label>
                        <label class="btn btn-default">
                            <input type="radio" name="motSolic" id="motSubstituicao" value=6 autocomplete=off> Substituição de Colaborador
                        </label>                    
                    </div> 
                  </div>   
            </div>

简讯

<script>
                            $(document).ready(function(){
                                $('#identAbertura').change(function(){
                                    $('.btn').removeClass().addClass('btn').addClass('btn-default');
                                    $(this).parent().removeClass("btn-default").addClass("btn-success");
                                });
                                $('#identMov').change(function(){
                                    $('.btn').removeClass().addClass('btn').addClass('btn-default');
                                    $(this).parent().removeClass("btn-default").addClass("btn-success");
                                });
                            });
                        </script>

打印

Answer 1

单选按钮颜色无法更改。但是您可以更改它的背景或文本颜色。

input[type="radio"]:checked{ 
   background : red;
}

Answer 2

你需要

使用 jquery 来实现这种效果。看起来您没有在代码中添加jquery

这是工作小提琴

$('.mot_solic').change(function(e){
 $(this).parent().siblings().removeClass('selected')
 $(this).parent().addClass('selected');
 console.log($(this));
});

.selected {
   background-color: #999;
}

<div class="row form-group">
                <div class="col-md-8">
                    <div class="btn" data-toggle="buttons">
                        <label class="btn btn-default">
                            <input type="radio" name="motSolic" class='mot_solic' id="motNovaFuncao" value=3 autocomplete=off> Nova Função
                        </label>
                        <label class="btn btn-default">
                            <input type="radio" name="motSolic" class='mot_solic' id="motRemanejamento" value=4 autocomplete=off> Remanejamento
                        </label>
                        <label class="btn btn-default">
                            <input type="radio" name="motSolic" class='mot_solic' id="motAumentoQuadro" value=5 autocomplete=off> Aumento de Quadro
                        </label>
                        <label class="btn btn-default">
                            <input type="radio" name="motSolic" class='mot_solic' id="motSubstituicao" value=6 autocomplete=off> Substituição de Colaborador
                        </label>                    
                    </div> 
                  </div>   
            </div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>