jQuery not doing what I want it to do
<p>I'm having trouble with a little jQuery, and thought someone in the community could help me out? So, my markup is as follows:</p>

<pre><code>&lt;div class="left"&gt;
    &lt;ul id="editing-nav"&gt;
        &lt;li&gt;&lt;a class="active testforso" href="#TestForSO"&gt;Test For SO&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a class="testforso2" href="#TestForSO2"&gt;Test For SO2&lt;/a&gt;&lt;/li&gt;
        ...and so on.
    &lt;/ul&gt;
&lt;/div&gt;

&lt;div class="scroll"&gt;
    &lt;div class="scrollContainer"&gt;
        &lt;div id="testforso"&gt;
            ...some content
        &lt;/div&gt;
        &lt;div id="testforso2"&gt;
            ...some content
        &lt;/div&gt;
        ...and so on.
    &lt;/div&gt;
&lt;/div&gt;
</code></pre>

<p>So, basically - .left is floated left, and .scroll is on the right side. I am looking for a way so the active nav element (by default, the first one, and then when the user would click another one, it'd assign that element a class of ".active" and remove the previous one's active class)'s co-insiding div has a display:block, while all others hide. I'm doing this inside of fancybox, which makes it a little bit more complicated, but here's what I have now -</p>

<pre><code>$('#editing-nav li &gt; a').click(function() {
        $('#editing-nav li &gt; a').removeClass('active');
        $(this).addClass('active');
        activeClassID = $(this).attr('class');  // grabs the nav class for the id to show in .scroll
        var divIDToShow = ('.scroll .scrollContainer #') + activeClassID;       // grabs the DOM path &amp; ID of the coinciding div to show
            divIDToShow = divIDToShow.replace(' active', ''); // removes " active" from the class (because before it would have a class of "testforso2 active"; now it just has "testforso".
        $('.scrollContainer div:not(#' + divIDToShow + ')').hide();
        $('.scrollContainer #' + divIDToShow ).show();
    });
</code></pre>

<p>This works for the first link someone clicks, but not after that. I don't know if I was clear earlier, but the class for the #editing-nav li a co-incides with what div to show inside of .scroll.</p>

<p>Any ideas? I'm not sure why it's doing this... Thank you!</p>
