jquery - wybranie sąsiadującego elementu

Witajcie, mam problem, który prawdopodobnie można łatwo rozwiązań ale brak mi doświadczenia w jquery.

Załóżmy, że mam mam generowane bloki w php, które mają postać:

<div class="ta_sama">
    <p>Nagłówek<p>
    <ul>
         <li></li>
         <li></li>
    </ul>
<div>

<div class="ta_sama">
    <p>Nagłówek<p>
    <ul>
         <li></li>
         <li></li>
    </ul>
<div>

Chciałbym aby lista ul była zwijana / rozwijana po kliknięciu na sąsiadujący nagłówek w tym samym div'ie.

Próbowałem to zrobić w ten sposób, aby rozróżnić aktywny blok (tymczasowo, dając zmianę koloru):

<script type="text/javascript">
	$(document).ready(function(){
		$('.ta_sama p').hover(function(){
			$(this).addClass('zazn');
		}, function(){
			$(this).removeClass('zazn');
		});
		$('.zazn').click(function(){
			$(this).css('background','red');
		});	
	});
</script>

Podejrzewam, że mój pomysł jest niepraktyczny, dlatego chciałbym prosić Was o pomoc jak sobie z tym poradzić.

Przecież to nawet nie powinno działać.

I dlaczego hover, a nie click?

Żadnych styli nie zmieniaj przez $.css - od tego masz css właśnie (są wyjątki, gdy trzeba tego użyć (webaplikacje), ale raczej nie do zmiany koloru).

Zacznij od początku robić to, czego oczekujesz, bo w tym momencie napisałeś kod, z którego ani linijki nie będziesz mógł wykorzystać do finalnego efektu - więc po co Ci w ogóle ten kod?

Od początku - pokaż kod, który jakoś zbliża Cię do rozwiązania problemu i opisz - co Ci nie wychodzi, z czym potrzebujesz pomocy?

Faktycznie nie dałem click na końcu.

Kwestia tyczy się tego, że każdy z bloków, który znajduje się w kodzie nie jest wyróżniony żadnym id, wszystkie bloki mają te same klasy.
Gdy mamy układ stron blokowy i np. chcielibyśmy zwinąć jeden z bloków aby nie zajmował aż tyle miejsca to klikamy na strzałkę przy nagłówku i zostaje nam widoczny tylko nagłówek - robię tak aby było więcej miejsca na stronie.

Dałem hover aby dodać klasę / aby wskazać, który element chcę zwinąć, ponieważ w innym wypadku kliknięcie na obojętnie, na który nagłówek zwija mi wszystkie bloki (ponieważ mają te same klasy) - ale to nie działa.

Zerknij na to:
http://webroad.pl/html5-css3/402-rozwijane-menu-z-wykorzystaniem-css3

Takie rzeczy rób na samym CSS-ie.

Ale tego rozwiązania nie da się zastosować w moim przypadku, ponieważ w tym css co przysłałeś wykorzystywane jest zasada lista w liście / hover, dlatego to działa.

generalnie logika jest taka:
po kliknięciu w paragraf <p>, który jest w divie z klasą ta_sama - element ul następujący po tym paragrafie schowaj/pokaż

potrzebujesz do tego z jQuery:
#selektor "div.ta_sama>p"
#zdarzenie $().click()
#funkcja $().next()
#funkcja $().toggle()

tyle

spróbuj poskładać to w kod i przede wszystkim - pokaż, co próbujesz robić

dzięki dzek69.. postaram się poskładać to do kupy i napiszę rozwiązanie / jak mi poszło.. może komuś się przyda, mimo wszystko nie wiem czy wykonam to dobrze praktycznie :P

Dziękuję za pomoc, dość krótki kod wyszedł a ja kombinowałem :/ next okazał się b. przydatny.

<script type="text/javascript">
	$(document).ready(function(){
		$('div.ta_sama').click(function(){
			$(this).next().slideUp();
			$(this).next().toggle();
		});	
	});
</script>

slideUp wywal, bo to będzie źle działać (i selektor powinien być na paragraf tylko)

Dziękuje dzek69, chyba najpoprawniej powinno być tak ?
Co masz na myśli z paragrafem ? / jakiś inny zapis ?

<script type="text/javascript">
	$(document).ready(function(){
		$('.ta_sama').click(function(){
			$(this).next().toggle();
		});	
	});
</script>

Nie widzę kodu HTML, ale jeżeli to <p> ma klasę layered_subtitle_heading no to wszystko jest ok (zakładając, że żaden inny element niezwiązany z tym menu nie ma takiej samej klasy)

edit: jeżeli problem jest rozwiązany to możesz porozdawać "łapki" tym, którzy Twoim zdaniem pomogli + oznaczyć (tylko jeden się da) post, który rozwiązuje problem (jest najbardziej pomocny)

ok poprawiłem klasę .layered_subtitle_heading na .ta_sama aby cały wątek był spójny.
Wszytko działa jak należy, dziękuję jeszcze raz.

Jak działa to spoko ;)