Как удалить класс при клике на body?

Question

[aleskokov]

Как прописать removeClass, чтобы при клике на любое место (body), удалялся .hover у .hiphop-item?

<div class="tabs">
	<span class="tabs-item vse">Все стили</span>
	<span class="tabs-item hiphop">Hip-Hop</span>
</div>	

<table class="timetable">
	<thead class="timetable-head">
		<tr class="timetable__days">
			<th></th>
			<th class="timetable__days-cell">Понедельник</th>
		</tr>
	</thead>
	<tbody>
		<tr class="timetable__time">
			<td>12:00</td>
			<td class="timetable-item hiphop-item">
				<a href="napravleniya/hip-hop.html">Yoga</a> 
				<a href="alena_mironova.html"><p>Алена</p></a>
			</td>
			<td></td>
		</tr>
	</tbody>
</table>

$(".hiphop").click(function() {
        $(".hiphop-item").addClass("hover");
    })

Comments

[Максим]

У вас уже в вопросе ответ содержится)

$("body").click(function() {
        $(".hiphop-item").removeClass("hover");
    })

[aleskokov]

Да, я написал именно этот код)) но после его написания перестает работать предыдущий: добавление класса(

[aleskokov]

Ощущение, что родительский класс у .hiphop-item не может удалить добавленный, а только ниже или равной иерархии.

[Froggyweb]

Вмплытие событий

[aleskokov]

Froggyweb, это как? возможно написать код?

Answer 1

[Арсений Матыцин]

Тебе необходимо реализовать механизм всплытия и перехвата.

Обновление:
Грубый пример можно глянуть тут. Грубый потому что не учитывает вложенные элементы, от него надо всплывать.

Comments

[aleskokov]

Я прочел данную статью, но в JS увы не особо понимаю, поэтому механизм был как для мартышки. Есть ли возможность подсказать с кодом обработчика?

[Арсений Матыцин]

aleskokov, https://codepen.io/i-am-studio_ru/pen/yLYQWod?edit... погружаешься от документа до элемента с классом в соответствии. Либо это он, либо убираешь у всех активных их состояние.