Learning jQuery - Fourth Edition

Ajax and events

Suppose we wanted to allow each dictionary term name to control the display of the definition that follows; clicking on the term name would show or hide the associated definition. With the techniques we have seen so far, this should be pretty straightforward:

// Unfinished code
$(document).ready(function() {
  $('h3.term').click(function() {
    $(this).siblings('.definition').slideToggle();
  });
});

Listing 6.18

When a term is clicked, this code finds siblings of the element that have a class of definition, and slides them up or down as appropriate.

All seems in order, but a click does nothing with this code. Unfortunately, the terms have not yet been added to the document when we attach the click handlers. Even if we managed to attach ...