[JavaScript][CSS][HTML]lista w liście i zdarzenie onclick Opcje

[SN@JPER^]

Witam.

Napisałem takie menu:

[HTML] pobierz, plaintext 
 <ul>
                        <li onclick="filter(2, 0);">1
 
                            <ul>
                                <li onclick="filter(2, 3);">1-1</li>
                                <li onclick="filter(2, 4);">2-1</li>
                            </ul>
                        </li>
                        <li onclick="filter(1, 0);">2
 
                             <ul>
                                <li onclick="filter(1, 1);">1-2</li>
                                <li onclick="filter(1, 2);">2-2</li>
                                <li onclick="filter(1, 5);">3-2</li>
                            </ul>
                        </li>
                    </ul>
[HTML] pobierz, plaintext 

Problem mam taki, że gdy klikne w element listy np. 2-1, to wywoluje się również funkcja z głównej list - 1.

Jak temu zapobiec? Jak zrobić, że jak klikne w element podrzędny, to element główny nie reaguje?

[Comandeer]

Zacznijmy od tego, że przerzuciłbym całość [onclick] do JS i dorobił w tych li przyciski (co to by nasze ładne menu było focusowalne z klawki), a sam filtr zapisał jako atrybut [data-filter]

A jak już to zrobimy to są dwa rozwiązania:

• blokada propagowania zdarzenia: http://jsfiddle.net/maaywjvv/
• event delegation: http://jsfiddle.net/69yptL3r/1/

Ogólnie warto poczytać: http://www.quirksmode.org/js/events_order.html

Natomiast jeśli chcesz szybkie rozwiązanie to: http://jsfiddle.net/jdbtk7gq/1/

[SN@JPER^]

Wykorzystałem szybkie rozwiązanie, dzięki wielkie!