Как ставить/снимать флажки у дочерних чекбоксов с помощью родителя?

Question

[Дмитрий]

Есть такой html:

Родитель: <input type="checkbox" id="parent" onclick="checkboxClick('#parent','.mycheckbox');" ><br> 
<br> 
Дочерний 1 <input type="checkbox" class="mycheckbox"><br> 
Дочерний 2 <input type="checkbox" class="mycheckbox"><br> 
Дочерний 3 <input type="checkbox" class="mycheckbox"><br> 
Дочерний 4 <input type="checkbox" class="mycheckbox"><br> 
Дочерний 5 <input type="checkbox" class="mycheckbox">

К нему такой js:

function checkboxClick(parent,checkboxes) {
	if($(parent).is(':checked')) {
		$(checkboxes).attr('checked', true);
	} else {
		$(checkboxes).attr('checked', false);
	}	
}

Задача у меня такая: при клике на родителе, снимать/ставить галочки у дочерних.
Есть маленький нюанс - у меня будет неизвестное кол-во групп родителей с их дочерними элементами.
Я не пойму почему в моем коде только один раз можно поставить/снять галочку? При следующих кликах на родителе с дочерними ничего не происходит.

Answer 1

[Anton fon Faust]

Потому что надо не attr('checked', true/false) использовать, а .prop

Answer 2

[supertrolyaso]

Проверил на codepen и у себя не компе лично, все прекрасно работает: https://codepen.io/anon/pen/jxOWxN

Comments

[Anton fon Faust]

проблемы начинаются, если почекать некоторые дочерние ручками)

[supertrolyaso]

Исправил: https://codepen.io/anon/pen/jxOWxN

[Anton fon Faust]

Nikolay Petyukh, я supertrolyaso отвечал)