ラジオボタンを変更すると、モーダルボタンの画像と背景色が変わりますか？

Question

私はこのデモhttps://jsfiddle.net/DTcHh/18578/を持っています。私がしようとしているのは、ユーザーがボタンレジスタの背景が緑色に変化し、モーダルヘッダにも画像があります。なにか提案を？

<div class="modal-header"> 

        <button type="button" class="close" data-dismiss="modal" aria-label="Close"> 
        <span aria-hidden="true">&times;</span> 
        </button> 
        <h4 class="modal-title" id="exampleModalLabel"><img src="img/user_icon_blue.png" />REGISTER</h4> 
        <span class="reg_type">SELECT ACCOUNT TYPE</span> 
        <div class="typeOfRegistration"> 
         <input type="radio" id="radio02" class="green" name="typeOfRegistration" data-target="#business" /> 
         <label for="radio02"><span></span>Business</label> 
        </div> 
        <div class="typeOfRegistration"> 
         <input type="radio" checked="checked" class="blue" id="radio01" name="typeOfRegistration" data-target="#personal"/> 
         <label for="radio01"><span></span>Personal</label> 
        </div> 
        <div class="line"></div> 
       </div> 

Answer 1

次のようにボタンの色とイメージチェンジをすることができようにするjQueryの：

$("input[type='radio']").on("change", function(){ 
    var rdo = $(this)[0]; 
    if(rdo.id == "radio02"){ 
     $(".btn, .btn-primary").css({ 
      backgroundColor: "green" 
     }); 
     $("#registrationImg").remove(); 
     } else { 
     $(".btn, .btn-primary").css({ 
      backgroundColor: "#428BCA" 
     }); 
     //$("#exampleModalLabel").append('<img id="registrationImg" src="user-icon_blue.png" />'); 
     var lbl = $('#registrationLabel'); 
     $('<img id="registrationImg" src="user-icon_blue.png" />').insertBefore(lbl); 
     } 
}); 

FIDDLE を参照してくださいHTMLに作られたいくつかのわずかな変化に注意してください。