My first little jquery project: problem with selectors

My first little jquery project: problem with selectors

Hi.

I am new to jquery and I need a little help for my first project.

I want to hide a div tag and then slide it down when a link is clicked. When the link is clicked a second time the div should slide back up. Basically an accordion effect.

Here's the html:

<div class="container">
      <h2 class="title">overskrift <span><a href="#" class="slidedown_on_click">more information</a></span></h2>
        <div class="slidedown_area">the content of the slider</div>      
</div>


Here is my jquery code so far:

   $(document).ready(function()
   {
      $('div.slidedown_area').hide();
      $('a.slidedown_on_click').click(function()
      {
                  $('this').parent('div').children('div.slidedown_area').slideDown('fast');
      });
      
   });


I have managed to hide the slide down area with the first line. The click function is also OK but there is something wrong in the way that I write my selector for slidedown area:

$('this').parent('div').children('div.slidedown_area').slideDown('fast');


Also I am not really sure how to ad a click function that hides the slide down area when clicked again.

I know that it is properly simple but we all gotta start somewhere.

All suggestions are most welcome.

Thanks!