Ребят, помогите кастомизировать радио кнопки.
Вот простой код:
<style type="text/css">
.checkbox-checked {
background: #FFCC00;
}
</style>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script>
$(window).load(function() {
//проверяет при загрузке страницы, отмечен чекбокс или нет и на отмеченные чекбоксы вешает класс.
$('input[type="radio"]').each(function () {
if ($(this).prop('checked')) {
$(this).parent().addClass('checkbox-checked');
}
});
//по клику лейблу присваивается или удаляется класс, в зависимости от того, что в атрибуте "checked".
$('input[type="radio"]').bind("change", function(){
if ($(this).is(":checked")) {
$(this).parent('label').addClass('checkbox-checked');
}
else {
$(this).parent('label').removeClass('checkbox-checked');
};
});
})
</script>
<label><input name="name" type="radio"/>один</label>
<label><input name="name" type="radio"/>два</label>
<label><input name="name" type="radio"/>три</label>
<label><input name="name" type="radio"/>четыре</label>
При выборе любой кнопки к ней применяется стиль checkbox-checked и она подсвечивается желтым цветом. Как сделать так, чтобы только к выбранной кнопке применялся стиль checkbox-checked, а с других кнопок сбрасывался? Сейчас получается так, что если пройтись по всем кнопкам, они будут все подсвечены желтым цветом.