Dynamic change of class of <TR> with Jquery
<p>This is my first post, and first please forgive me for my poor english.</p>

<p>I have a problem I really can't fix:</p>

<p>I have a <code>&lt;table&gt;</code> of questions, </p>

<ol>
<li><p>the first question is visible (class:visible), the others are hidden (class:hidden)</p>

<pre><code>        $(document).ready(function(){
        $('.hidden').hide();
</code></pre></li>
<li><p>When people click on the first question, I want the second question to appear (and the first question to turn to grey, using a 'done' class).</p></li>
</ol>

<blockquote>
<pre><code>$('.visible:not(.done)').click(function(){ 
                $(this).addClass('done'); 
                $('.hidden:first').toggle(500).removeClass('hidden').addClass('visible');
            })
</code></pre>
</blockquote>

<p>The first question is now done (class:done) and the 2nd question should be the only one to react to a click(), and so on... But it doesn't work: the other <code>&lt;tr&gt;</code>  appear only when I click on the 1st <code>&lt;tr&gt;</code>.</p>

<p>Can someone give me a hand on this problem ? 
Thank you.</p>
