title: How to tab to fieldset, expand, and also change class if not all fields are populated?
body: <p>I have a system where forms are built dynamically, and some may contain 100+ questions.  Each of these questions contain around 3 different child-questions/fields for responses.  The child-questions are wrapped in a div: <code>.dfcolumns</code> that is collapsed on page load, then I'm using jquery toggle to expand them when the question/legend is clicked.</p>
  
  <p><strong>I need to accomplish two more things here:</strong></p>
  
  <ol>
  <li><p>Tab to the next fieldset and have it open. (would be awesome to have only one open at a time, like an accordion)</p></li>
  <li><p>Change the class of a fieldset/legend if all child fields are populated (I'm not looking for basic form validation here, as I want this to happen during the process, not when hitting submit).</p></li>
  </ol>
  
  <p>Basically for a better user experience, I'd like to let he user have the ability to tab through the questions, and know which questions they've completed along the way.</p>
  
  <p><strong>The html:</strong></p>
  
  <pre><code>&lt;div class="dform"&gt;
  &lt;div class="dform_element"&gt;
      &lt;div class="dform_container"&gt;
          &lt;fieldset&gt;
          &lt;legend&gt;1. Question/Toggle Trigger&lt;/legend&gt;
              &lt;div class="dfcolumns"&gt;
                  *a bunch of field types here…
              &lt;/div&gt;
          &lt;/fieldset&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  &lt;div class="dform_element"&gt;
      &lt;div class="dform_container"&gt;
          &lt;fieldset&gt;
          &lt;legend&gt;2. Question/Toggle Trigger&lt;/legend&gt;
              &lt;div class="dfcolumns"&gt;
              &lt;div class="dfcolumns"&gt;
                  *a bunch of field types here…
              &lt;/div&gt;
          &lt;/fieldset&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p></p>
  
  <p><strong>The CSS:</strong> <code>.dfcolumns {display: none;}</code></p>
  
  <p><strong>The toggle function:</strong></p>
  
  <pre><code>    $(function(){
      $("legend").click(function(){
              $(this).parent().find(".dfcolumns").slideToggle("slow");
      });
  });
  </code></pre>
  
  <p>Are either of these other two goals even possible?  And if so, any ideas on how I would go about it?</p>
  
  <p>Thanks so much for any input!</p>