Javascript-форум - Скрытие элемента по чекбоксу

Javascript-форум (https://javascript.ru/forum/)

- Элементы интерфейса (https://javascript.ru/forum/dom-window/)

- - Скрытие элемента по чекбоксу (https://javascript.ru/forum/dom-window/76270-skrytie-ehlementa-po-chekboksu.html)

Скрытие элемента по чекбоксу

Добрый день. Есть разметка:

<div class="group">
   <div class="field parent">
      <div class="title">Тумблер переключения валют<span class="desc">Опция позволяет выводить переключатель валюты.</span></div>
      <div class="control"><input type="checkbox" id="converter" name="converter" value="1" checked="checked" class="switch"><label class="switch-label" for="converter"></label></div>
   </div>
   <div class="field child">
      поле 1
   </div>
   <div class="field child">
      поле 2
   </div>
   <div class="field parent">
      // здесь ещё один тумблер
   </div>
</div>

Подскажите, как скрывать и показывать блоки с классом child при изменении вышележащего чекбокса с классом родителя parent. Скрыть всё до следующего элемента с классом parent. Чекбок активен - child - открыто, не активен, то скрыто.

Нужно на jquery. Пока накидал так:

$('.parent').each(function(i, parent) {
	$('input.switch', parent).change(function() {
		console.log( parent );
		$(parent).nextUntil('.parent').filter('.child').toggle(this.checked)
	}).change() 
});

Цитата:

Сообщение от Янковиц

Пока накидал так:

нормальный вариант

Не работает. Чего-то не хватает :cray:

Янковиц,

<!DOCTYPE html>

<html>
<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <style type="text/css">
  </style>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>

  <script>
$(function() {
$( ".parent" ).each(function() {
    var el = $(this).nextUntil('.parent'),
    checkbox = $(':checkbox',this);
    checkbox.change(function() {
    el.toggle(this.checked)
  }).change()
 });
});
  </script>
</head>

<body>
<div class="group">
   <div class="field parent">
      <div class="title">Тумблер переключения валют<span class="desc">Опция позволяет выводить переключатель валюты.</span></div>
      <div class="control"><input type="checkbox" id="converter" name="converter" value="1" checked="checked" class="switch"><label class="switch-label" for="converter"></label></div>
   </div>
   <div class="field child">
      поле 1
   </div>
   <div class="field child">
      поле 2
   </div>
    <div class="field parent">
      <div class="title">Тумблер переключения валют<span class="desc">Опция позволяет выводить переключатель валюты.</span></div>
      <div class="control"><input type="checkbox" id="converter" name="converter" value="1"  class="switch"><label class="switch-label" for="converter"></label></div>
   </div>
   <div class="field child">
      поле 1
   </div>
   <div class="field child">
      поле 2
   </div>
</div>

</body>
</html>

Благодарю, как всегда выручили :)