Rozwijane divy Opcje

[Outside]

Witam, robię stronę i chcę zrobić, aby newsy były wysuwane więc skorzystałem z gotowego skryptu znalezionego na tym forum, ale działa on tylko na jednego diva, gdy jest ich kilka wysuwa tylko pierwszego niezaleznie od tego na którego klikne. Błąd wiem na czym polega, ponieważ "rozwin" dziala tylko na diva o id panel, ale nie mam bladego pojęcia o javascript więc mógłby mi go ktoś przerobić tak, aby każde rozsunięcie działało do odpowiedniego diva?
Tutaj link
http://jsfiddle.net/WmAkc/171/

[kamil4u]

1. ID jest unikalne - użyj class - w CSS i jQuery: .TwojaKlasa w HTML class="TwojaKlasa"
2. Następnie zmień jedynie tę linię $panel = $("#panel"); korzystając z innych możliwości DOM

Najłatwiej zrobić to tak - http://jsfiddle.net/DGDjz/ :
HTML:

[HTML] pobierz, plaintext 
<div>
  <div class="belka">
      <div class="zwin">zwiń</div>
  </div>
  <div class="panel">
      <p>Lorem ipsum dolor sit amet</p>
      <p>Lorem ipsum dolor sit amet</p>
  </div>
</div>
[HTML] pobierz, plaintext 

JS:

[JAVASCRIPT] pobierz, plaintext 
$(document).ready(function() {
 
    $(".belka .zwin").click( function(){
        var $button = $(this),
            $panel = $( this ).parent().parent().find(".panel");
        $panel.stop(true,true);
        $panel.slideToggle(1000, function(){
            var text;
            if($panel.is(':visible'))
            {
                text = 'zwiń';
            }
            else
            {
                text = 'rozwiń';
            }
            $button.toggleClass('rozwin').text(text);
        });
    });
 
});
[JAVASCRIPT] pobierz, plaintext 

[Outside]

A mozna to jakos przerobic tak, zeby początkowy div był schowany?

[kamil4u]

http://jsfiddle.net/DGDjz/1/