Learning jQuery 1.3, chapt 4: Gettysburg Address - problem revealing duplicate text

Learning jQuery 1.3, chapt 4: Gettysburg Address - problem revealing duplicate text

Hi

I'm working with Learning jQuery 1.3, chapt 4, specifically the 'Abraham Lincoln's Gettysburg Address' read more text reveal example. I can understand the logic in how to reveal one block/div of text, but I need the same effect to apply to 4 distinct divs/blocks of text.

The code that reveals <div class="speech"> is:
  1.   var $speech = $('div.speech');

I need to have 4 blocks of text: <div class="speech-1"> ... <div class="speech-4"> with each having the same show/hide function as the single example in the book.

Thus far I tried it by duplicating the divs and blocks of script, and appending them to:
  1. <div class="speech1"> ... <div class="speech4">
  2. $speech1 ... $speech4  - etc etc.

but this only leads to all of the divs opening/closing from any of the 'read more' links, and not the individual divs.

Can somebody please help me in getting the script to apply to this scenario of 4 distinct divs. I assume that this will involve an 'if/or' statement or maybe 'switch' block, but I really don't know how to get it to work.

Many thanks in advance
janowicz