[JavaScript] Show/Hide który schować atrybut data Opcje

[Czikusek]

Napisałem sobie prostą listę kategorii: (czy kategorie powinny być na <li> ?)

[HTML] pobierz, plaintext 
<div class="item"><a href="#" title="" data-id="1">1</a></div>
<div class="item"><a href="#" title="" data-id="2">2</a></div>
[HTML] pobierz, plaintext 

chce osiągnąć taki efekt, że po kliknięciu na kategorię pokaże się lista subkategorii do TEJ kategorii, dlatego dodałem znaczniki data.

Później mam listę subkategorii:

[HTML] pobierz, plaintext 
<div class="subcategories-list" data-subcategory="1" style="display: none;">
 
	aaaaaaaaaaaaa
 
</div>
[HTML] pobierz, plaintext 

No i chcę żeby działało:

[HTML] pobierz, plaintext 
$('.maincategories a').click(function(){
			var clicked = $(this).data("id");
			$('.subcategories-list[data-subcategory="'+clicked+'"]').show();
		});
[HTML] pobierz, plaintext 

i działa... rozwija mi listę subkategorii z tym że nie chowa poprzedniej. Jak to zrobić?

Ten post edytował Czikusek 2.08.2018, 12:32:36

[Czikusek]

No właśnie tylko że, mam te kategorie główne

[PHP] pobierz, plaintext 
<div class="item"><a href="#" title="" data-id="1">1</a></div>
<div class="item"><a href="#" title="" data-id="2">2</a></div>
<div class="item"><a href="#" title="" data-id="3">3</a></div>
<div class="item"><a href="#" title="" data-id="4">4</a></div>
<div class="item"><a href="#" title="" data-id="5">5</a></div>
<div class="item"><a href="#" title="" data-id="6">6</a></div>
<div class="item"><a href="#" title="" data-id="7">7</a></div>
<div class="item"><a href="#" title="" data-id="8">8</a></div>
[PHP] pobierz, plaintext 

A pod spodem subkategorie. Jak teraz wrzucić pod kategorie 1-4 subkategorie jeśłi sie na nie kliknie?

I dodatkowo jak po kliknięciu jeszcze raz w tą samą kategorie ją schować? bo teraz kliknie - otwiera się, ale jak znowu kliknę to już sie nie chowa.

Ten post edytował Czikusek 2.08.2018, 13:06:05