Измените класс li на активный класс

Question

Для целей стиля im, используя классы UL и li для хранения некоторых вариантов выбора формы. Я собираюсь отключить переключатель, а затем использовать значение в форме submit. Я выяснил, как проверить радиоокнез, когда нажата кнопка <li>, но по какой-то причине выбранный класс не добавлен в <li>, который содержит переключатель.

Heres код:

<ul class="options-num"> 
    <li><input type="radio" name="group1" value="2000"> 2,000</li> 
    <li><input type="radio" name="group1" value="2000"> 4,000</li> 
    <li><input type="radio" name="group1" value="2000"> 6,000</li> 
    <li><input type="radio" name="group1" value="2000"> 8,000</li> 
    <li><input type="radio" name="group1" value="2000"> 10,000</li> 
</ul> 

Ниже мой JavaScript, это работает для настройки радио, как проверено, когда литий нажат, но не делаешь набор выбранного класса:

$(".options-num > li").click(function(){ 
    $(".options-num > li").find('input[type="radio"]').removeAttr('checked'); 
    if($(this).find('input[type="radio"]').attr('checked','checked')) { 
     $(this).parent().addClass("selected"); 
    } 
}); 

Это то, что я пытался первым но не работал

$('.options-num li').click(function(){ 
    var radio = $(this).children('input[type=radio]'); 
    if (radio.is(':checked')) { 
     $(this).parent().addClass("selected"); 
     //$("#foo").toggleClass(className, addOrRemove); 
     //$(this).('.options-num li').addClass('selected'); 
    } /*else { 
     $(this).parent('li').removeClass('selected'); 
    } 
}) 

Answer 1

здесь решение:

https://jsfiddle.net/bb6fp28p/

<ul class="options-num"> 
      <li><input type="radio" name="group1" value="2000"> 2,000</li> 
      <li><input type="radio" name="group1" value="2000"> 4,000</li> 
      <li><input type="radio" name="group1" value="2000"> 6,000</li> 
      <li><input type="radio" name="group1" value="2000"> 8,000</li> 
      <li><input type="radio" name="group1" value="2000"> 10,000</li> 
</ul> 

CSS:

.selected{ 
    background:green; 
} 

JS

$('.options-num li').click(function(){ 
    $('.options-num li').removeClass('selected'); 
    $(this).addClass('selected'); 
    $(this).find('input').prop('checked', true); 
}); 

Answer 2

.attr('checked','checked') устанавливает атрибут элемент.

Используйте .prop('checked'), и проблема должна быть исправлена!