How to trigger a class-targeted method AFTER the class has been added to an element?
<p>In the below markup, the <code>#enable</code> button will add a class to the <code>#show</code> div. This class has a method attached to it that fades in/out the <code>#hidden</code> span.</p>

<p>However, even though the class is added to the <code>#show</code> div, the method attached to the class isn't triggered.</p>

<p><strong>HTML</strong></p>

<pre><code>&lt;input type='button' id='enable' value='Enable' /&gt;

&lt;div id='show'&gt;
Testing.. &lt;span id='hidden'&gt;Testing, 1, 2, 3.&lt;/span&gt;
&lt;/div&gt;​
</code></pre>

<p><strong>JS</strong></p>

<pre><code>$(function() {

    // Adds .testing class after the button is clicked. however..
    $('#enable').click(function() { 
        $('#show').addClass('testing')
    });

    // It will not trigger after .testing class has been added to DIV?            
    $('.testing').hover(function() { 
        $('#hidden').fadeIn(); 
    }, function() {
        $('#hidden').fadeOut(); 
    });
});​
</code></pre>

<p>Fiddle to work with: <a href="http://jsfiddle.net/jS3nM/" rel="nofollow">http://jsfiddle.net/jS3nM/</a></p>

<p>It seems I am missing something conceptually. What is the correct way to handle this?</p>
