Having trouble getting Jquery .closest() working?
<p>I'm having trouble getting Jquery <code>.closest()</code> to work. </p>

<p>Here's my code, it's simple and I can't see any reason why it shouldn't work:</p>

<p><strong>Jquery</strong></p>

<pre><code>show:function(a,fx){
        $('.more-content').hide();

        $(a).toggle(function() {
                t = $(this).closest(".more-content")
                if (fx.match('show')) {
                    t.show()
                };
                if (fx.match('slide')) {
                    t.slideDown()
                };
                if (fx.match('fade')) {
                    t.fadeIn()
                };
                $(this).html('Less')
            }, function() {
                if (fx.match('show')) {
                    t.hide()
                };
                if (fx.match('slide')) {
                    t.slideUp()
                };
                if (fx.match('fade')) {
                    t.fadeOut()
                };
                $(this).html('More')
            });
        } 
</code></pre>

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

<pre><code>    &lt;p&gt;&lt;strong class="goal"&gt;The Goal&lt;/strong&gt;&lt;br /&gt;
    To support those who are NEET &lt;span class="more-content"&gt;We do this by providing education or training to enable said people to be...&lt;/span&gt;
    &lt;span class="more"&gt;More&lt;/span&gt;

    &lt;br /&gt;&lt;br /&gt;
    To build community cohesion in the local area. &lt;span class="more-content"&gt;This will lead to a community where people have the opportunity...&lt;/span&gt; 
    &lt;span class="more"&gt;More&lt;/span&gt;
    &lt;/p&gt;
</code></pre>

<p>Confused, so any help is greatly appreciated, Thanks</p>
