function toggleTarget(event) {
  // NOTE:  Within an event handler, 'this' always refers to the element they are registered on.
  this.next().toggle();
  if ( this.next().visible() ) {
    this.addClassName('expanded');
    this.down('img').replace('<img src="./css/images/minus.gif" alt="hide section" />');
  } else {
    this.removeClassName('expanded');
    this.down('img').replace('<img src="./css/images/plus.gif" alt="show section" />');
  }
}

document.observe('dom:loaded', function() {
  var triggers = $$('.trigger');
  for (var i = 0, len = triggers.length; i < len; ++i) {
    triggers[i].insert({ top: '<img src="./css/images/plus.gif" alt="show section" />' });
    triggers[i].next().hide();
    triggers[i].observe('click',toggleTarget);
  }
  var expandeds = $$('.expanded');
  for (var i = 0, len = expandeds.length; i < len; ++i) {
    expandeds[i].insert({ top: '<img src="./css/images/minus.gif" alt="hide section" />' });
    expandeds[i].addClassName('trigger');
    expandeds[i].observe('click',toggleTarget);
  }
});