Скрытие - показ элементов

[Янковиц]

Есть две одинаковые таблицы:

<table class="form-table no-border">
	<tbody>
		<tr class="parent">
			<th scope="row">Заголовок</th>
			<td>
				<label class="switch_wrap">
					<input name="option[ym]" id="ym" class="parent" value="1" type="checkbox">
				</label>
			</td>
		</tr>
		<tr>
			<th>Заголовок</th>
			<td>Текст</td>
		</tr>
	</tbody>
</table>
<table class="form-table no-border">
	<tbody>
		<tr class="parent">
			<th scope="row">Заголовок</th>
			<td>
				<label class="switch_wrap">
					<input name="option[ym]" id="ym" class="parent" value="1" type="checkbox">
				</label>
			</td>
		</tr>
		<tr>
			<th>Заголовок</th>
			<td>Текст</td>
		</tr>
	</tbody>
</table>

При изменении input parent на checked, нужно скрывать блок tr, который ниже.
Мой js такой:

$(document).ready(function(){
	var _this = $('.switch_wrap .parent');
	_this.change(function(){
		if (_this.prop('checked')) {
			_this.parents(3).nextAll('tr').fadeIn();
		} else {
			_this.parents(3).nextAll('tr').fadeOut();
		}
	});
	if (_this.prop('checked')) {
		_this.parents(3).nextAll('tr').fadeIn();
	} else {
		_this.parents(3).nextAll('tr').fadeOut();
	}
});

Однако, при переключении чекбокса из второй таблицы, скрытие и показ срабатывает только tr из первой

[Янковиц]

Как сделать, чтобы срабатывал на ту таблицу, в которой расположен чекбокс

[Dilettante_Pro]

Какое-то дежавю.... https://javascript.ru/forum/dom-wind...i-tablicy.html

<table class="form-table no-border">
	<tbody>
		<tr class="parent">
			<th scope="row">Заголовок</th>
			<td>
				<label class="switch_wrap">
					<input name="option[ym]" id="ym" class="parent" value="1" type="checkbox">
				</label>
			</td>
		</tr>
		<tr>
			<th>Заголовок</th>
			<td>Текст</td>
		</tr>
	</tbody>
</table>
<table class="form-table no-border">
	<tbody>
		<tr class="parent">
			<th scope="row">Заголовок</th>
			<td>
				<label class="switch_wrap">
					<input name="option[ym]" id="ym" class="parent" value="1" type="checkbox">
				</label>
			</td>
		</tr>
		<tr>
			<th>Заголовок</th>
			<td>Текст</td>
		</tr>
	</tbody>
</table>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>

<script>
$(document).ready(function(){
        var chex = $('.switch_wrap .parent');
	chex.change(function(){
                var _this = $(this);
		if ( _this.prop('checked')) {
			_this.parents(3).nextAll('tr').fadeIn();
		} else {
			_this.parents(3).nextAll('tr').fadeOut();
		}
	});
    chex.parents(3).nextAll('tr').fadeOut();
});
</script>

И еще: во избежание дальнейших проблем не должно быть два раза id="ym"