jQuery: Toggle a div that has no ID

I need to toogle divs individually that don't have ID's.

Each time the title section is clicked the content section that follows that title div needs to appear and disappear. At the moment they all appear/disappear.

How do I set it (without using IDs) to only toggle only the content for the section where the title is being clicked?

I can not use a IDs because the HTML is automatically created using a CMS program.

Any help is much appreciated!

The page can be found here...

http://ag-chartered-accountants.com/?action=news

<div id="news"> 

<div class="story">
<div class="title">This is Storey Title 1</div>
<div class="content"> This is the content 1</div>
</div>

<div class="story">
<div class="title">This is Storey Title 2</div>
<div class="content"> This is the content 2</div>
</div>

<div class="story">
<div class="title">This is Storey Title 3</div>
<div class="content"> This is the content 3</div>
</div>

</div>

<script>
  $(".title").live('click', function () {
    $(".content").fadeToggle("fast");
  });
</script>

Select allOpen in new window