jquery toggleClass

jquery toggleClass

Hiya,

Can somebody please help?

I'm trying to use jquery's toggleClass to reveal/hide text by toggling classes with different height attributes.

my jquery code is as follows:


  1. $(function() {
  2.     $(".button").click(function() {
  3.         $('.latestActual').toggleClass('newClass', "fast");
  4.         return false;
  5.     });
  6. });


My HTML is as follows:  (there'll be multiple instances of the below code stacked on top of each other)


  1. <div class="dateAndTitle">
  2.                            
  3.     <div class="dateBox">
  4.                                
  5.         <h3>20th January 2010</h3>
  6.                                
  7.     </div>
  8.                                
  9.     <div class="latestTitle">
  10.                                
  11.     <h3>Extended Title Blah Blah Blah.</h3>
  12.                                
  13.     </div>
  14.                                
  15.     <br class="clearing" />
  16.                            
  17. </div>
  18.                            
  19. <div class="latestActual">
  20.                            
  21.     <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Duis ligula lorem, consequat eget, tristique nec, auctor quis, purus. Vivamus ut sem. Fusce aliquam nunc vitae purus. Aenean viverra malesuada libero. Fusce ac quam. Donec neque. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Duis ligula lorem, consequat eget, tristique nec, auctor quis, purus. Vivamus ut sem. Fusce aliquam nunc vitae purus. Aenean viverra malesuada libero. Fusce ac quam. Donec neque.</p>
  22.                            
  23. </div>
  24.                            
  25. <div class="moreNews">
  26.                            
  27.     <p class="button"><a href="#">show/hide</a></p>
  28.                            
  29. </div>


My problem is that when I click the show/hide button, all the classes expand.  I'm not able to give the divs different class names due to the way the CMS creates multiple news items using a template, so they'll all have the same class name.

Does this make sense??

I'm hoping I haven't approached this in the completely wrong way..

Jon.