선택한 라디오 버튼의 부모에게 스타일 적용하기

Question

<li> 요소 안에 일련의 라디오 버튼이 있습니다. 그 자식 라디오 버튼이 체크 된 경우에만 <li>에 경계를 만들려고합니다.

$('input[type="radio"]').change(function() { 
    if($(this).is(':checked')) 
    { 
     $(this).parent().css('border', '1px solid black'); 
    } 
    else 
    { 
     $(this).parent().css('border', 'none'); 
    } 
}); 

그러나 이것은 단지 스타일을 추가하지만, 라디오 버튼에서 다른 옵션을 선택하면 제거되지 않습니다

나는 jQuery를에 여기에 중간 해결책을 가지고 있습니다. 따라서 모든 옵션을 클릭하면 스타일이 모두 적용됩니다.

여기서 어떻게 할 수 있습니까?

Answer 1

라디오 버튼이

var lis = $('input[type="radio"]').change(function() { 
 
    lis.css('border', 'none'); 
 

 
    if ($(this).is(':checked')) { 
 
     $(this).parent().css('border', '1px solid black'); 
 
    } 
 
}).parent(); // gets all the parents

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 

 
<ul> 
 
    <li><input type="radio" name="group"></li> 
 
    <li><input type="radio" name="group"></li> 
 
    <li><input type="radio" name="group"></li> 
 
</ul>