title: jQuery troubleshooting techniques
body: <p>I'm trying to find a problem in the code below from a Q&amp;A toggle panel where each <code>h3</code> question is followed by a div answer. This particular code is supposed to go through all the questions and answers and close any that are open.</p>
  
  <p>I'm not asking here what's wrong with the code but if there might be some tricks to troubleshooting it I don't know about.  For example, when the <code>.next()</code> shifts over to the div for this <code>h3</code>, it would be nice to have a variable somewhere that represented that div jQuery object, i.e, the result of the <code>next()</code>. And in the <code>slideToggle(1000)</code> it would be nice to see the the toggle state variable that <code>slideToggle()</code> is looking at.</p>
  
  <pre><code>$('#qa h3').each(function() {
  debugger;
  this$ = $(this);
  if(this$.hasClass('ui-state-active')) {
      this$.toggleClass("ui-state-active ui-state-default")
     .next()
      .toggleClass("ui-accordion-content-active")
      .slideToggle(1000);
  } 
  </code></pre>
  
  <p>Thanks for any suggestions</p>