Как активировать нужный checkbox по клику на родителя?

Question

[lexstile]

Есть код:

<li class="list-group-item">
                        <div class="material-switch pull-right">
                            <input id="cr" onclick="func();" checked="" type="checkbox" name="cr"/>
                            <label for="cr" class="label-default"></label>
                        </div>
                    </li>

Как через JS активировать при клике нужный input?(при клике на list-group-item)
Инпутов не один, поэтому нужно активировать именно тот, на который нажал.
dropmefiles.com/AgxO0

Comments

[Алексей Сол]

Не совсем, к сожалению, понятен вопрос. У вас в одном "li" будет несколько чекбоксов? Можете, пожалуйста, привести пример кода с несколькими инпутами, для лучшего понимания.

Answer 1

[Victor Oberemko]

lexstile, если я правильно понял задачу, то вот так можно - codepen.io/swistikkk/pen/GrOaRv

Стили я чисто для себя поставил)

Comments

[lexstile]

Решение рабочее, спасибо) Единственное, стили идут своей дорогой после добавления div.
Накостылял свое решение:
$('.list-group-item').click(function(){
if($(this).find('input').is(':checked')){
$(this).find('input').removeAttr('checked');
}else{
$(this).find('input').attr('checked','checked');
}
});

Answer 2

[Олег]

Как вариант так https://jsfiddle.net/Politonius/Lzkzon6L/
или так https://jsfiddle.net/Politonius/Lzkzon6L/1/

Comments

[lexstile]

Спасибо за ответ. Но label уже заточен под переключатель. Нужно сделать исключительно через js.
Чтобы при вызове события клик на list-group-item checkbox переходил в состояние checked.
То есть:
$('list-group-item').click(function(){
а тут обратиться именно к к тому внутреннему элементу, на родителя которого( li ) мы нажали
});

[lexstile]

dropmefiles.com/AgxO0