What if I've got several div's of the same name?

What if I've got several div's of the same name?

Hi All,

I'm new here so please be gentle with me!!

I've a news thingy and initially I want the news to display like this:

News headline1 and date
News headline2 and date
News headline3 and date

When a user clicks on one of these headlines I'd like it to show the details:

News headline1 and date

News headline2 and date
News Details2 blah blah blahblah blah blahblah blah blahblah blah lahblah blah blahblah blah blahblah blah blahblah blah blahblah blah blahlah blah blah

News headline3 and date


I have managed to get this to work using a simple jquery show/hide which hides everything with the ID of NewsDetail to start with and on click of NewsHeadline will show NewsDetail. The code looks a bit like this.

<div class="NewsHeadline">Headline</div>
<div class="NewsDetail">Details1 here</div
<div class="NewsHeadline">Headline2</div>
<div class="NewsDetail">Details2 here</div>


Great, but it shows all NewsDetail's on the page, whichever NewsSummary is clicked, as you'd expect and I cannot find a way of just showing the NewsDetail for the NewsHeadline that's been clicked!

Is anyone able to feer me some advice?

Sarah