Witam,
korzystam z biblioteki jQuery i natrafiłem na pewien problem. Muszę się przyznać, że kontakt z js i jQuery dopiero zaczynam-potrzebuję poznać ten język i tą bibliotekę, na razie próbuję to wszystko ogarnąć ;)

Mam taki kod:
-w pliku html:
[HTML] pobierz, plaintext 
  1. <div id="lista">
  2. 	<ul class="podlista">
  3. 		<li id="folder" class="open">folder z notatkami otwarty</li>
  4. 			<li id="notatka-w-folderze">notatka w folderze</li>
  5. 		<li id="notatka">zwykla notatka</li>
  6. 		<li id="folder" class="close">folder zamkniety</li>
  7. 			<li id="notatka-w-folderze">druga notatka w folderze</li>
  8. 	</ul>
  9. </div>
[HTML] pobierz, plaintext

i w pliku js:
Kod
$(document).ready(
function() {
    $("#folder.open").click(
    function() {
        $("#notatka-w-folderze").hide(
            function() {
            $("#folder").removeClass('open').addClass('close');
                })
        }
    )
},

function() {
    $("#folder.close").click(
    function() {
        $("#notatka-w-folderze").show(
            function() {
            $("#folder").removeClass('close').addClass('open');
                })
        }
    )
});


chciałbym aby po kliknięciu konteneru rozwinął się, lub zwinął w zależności od akcji, a przy okazji zmienił klasę.
Na razie działa to w jedną stronę-zwija kontener #folder z klasą "open", natomiast nie rozwija go i nie podmienia klasy na "close". A dodatkowo działa to tylko w przypadku pierwszego konteneru, natomiast drugiego o tej samej nazwie już nie.
Przeglądałem wcześniej tutorial jQuery i próbowałem z opcją replace(), ale także nie działa.
Gdzie popełniam błąd?