如何根據選中的單選按鈕爲div添加類？

Question

我已經寫了像下面的代碼行的HTML。

<div class="form-group"> 

    <div class="i-checks"> 
     <label class="col-sm-6 control-label"> 
     <div class="iradio_square-green" style="position: relative;"> 
     <input type="radio" value="name" name="checkchoice" style="position: absolute; opacity: 0;"> 
     <ins class="iCheck-helper" style="position: absolute; top: 0%; left: 0%; display: block; width: 100%; height: 100%; margin: 0px; padding: 0px; background: rgb(255, 255, 255); border: 0px; opacity: 0;"></ins> 
     </div> 
     Name 
     </label> 
    </div> 

    <div class="i-checks"> 
     <label class="col-sm-6 control-label"> 
     <div class="iradio_square-green" style="position: relative;"> 
     <input type="radio" value="rollno" name="checkchoice" style="position: absolute; opacity: 0;"> 
     <ins class="iCheck-helper" style="position: absolute; top: 0%; left: 0%; display: block; width: 100%; height: 100%; margin: 0px; padding: 0px; background: rgb(255, 255, 255); border: 0px; opacity: 0;"></ins> 
     </div> 
     Roll No 
     </label> 
    </div> 

</div> 

現在我想，如果有人在「檢查」對應的div <div class="iradio_square-green" style="position: relative;">類選擇任何單選按鈕，然後應附加像<div class="iradio_square-green checked" style="position: relative;">

我已經試過

$(document).ready(function() { 
    $(':radio').change(function() { 
    $(':radio[name=' + this.name + ']').parent().removeClass('checked'); 
    $(this).parent().addClass('checked'); 
    }); 
});​ 

這是不工作

Answer 1

你可以用純CSS做到這一點，不需要JS（如果造型是你唯一的目標）

CSS：

input[type=checkbox]:checked ~ div { 
    some styles.... 
} 

理想情況下，你會使用的類名，而不是爲標籤上面的名字。