jQuery toggling visiblity of two adjacent spans
<pre><code>&lt;span class='act_inact active'&gt;Active&lt;/span&gt;&lt;span class='act_inact inactive'&gt;Inactive&lt;/span&gt;
</code></pre>

<p>When I click .active it should become hidden and .inactive should be come visible and vice verca. As these are classes, there are many on the page.</p>

<pre><code>$('.act_inact').click(function() {          
   $(this).toggle();
   $(this).closest('.act_inact').toggle(); 
  });
</code></pre>

<p>This does nothing but I don't quite know why? I'd prefer using closest() to avoid having to use next() and prev().</p>
