jQuery $(this) selector and sibling

Need an elegant way to add toggle effects to individual (but similar) items on something like a faq page? Use jquery’s $(this) selector with its sibling and the toggle effect.

Here is what my friend Justin of Collective Industry came up with.

1 $("ol.faqs li h4").click(function () {
      2      $(this).siblings('p').toggle();
      3 });

And here is what the html might look like

 1 <ol class="faqs">
       2   <li>
       3     <h4>Are there any setup fees?</h4>
       4     <p>
       5       Absolutely not &mdash; <em>there are no upfront fees</em> of any kind. 
       6       We're not that kind of people.
       7     </p>
       8   </li>
       9   <li>
      10     <h4>Is this a long-term commitment?</h4>
      11     <p>
      12       Nope &mdash; you simply pay as you go on a month-to-month basis. You can
      13       <em>cancel your Kareo account at any time</em>.
      14     </p>
      15   </li>
      16   <li>
      17     <h4>Are your prices per&ndash;practice, per&ndash;provider, or per&ndash;user?</h4>
      18     <p>
      19       You pay a <em>subscription fee for each active provider</em> (i.e.
      20       physician or medical provider) set up on your account and you can add and remove
      21       providers at any time. There are no additional per&ndash;practice or per&ndash;user fees.
      22     </p>
      23   </li>
      24   <li>
      25     <h4>Do I need to set up an account with a clearinghouse?  Are there additional fees?</h4>
      26     <p>
      27       <em>No &mdash; you do not need to set up an account with a clearinghouse</em> and
      28       there are no additional fees for electronic claims and remittance services.  
      29       Kareo offers an integrated solution that includes web-based software for your 
      30       practice combined with electronic connectivity to insurers &mdash; all provided 
      31       under one affordable fee structure.
      32     </p>
      33   </li>
      34 </ol>

Picture of Scott Motte

Spitfire Sky | github | archives | resume