Perry
Perry

Reputation: 1

Toggle & Javascript: Can't Get It To Work

I asked my first question last night. Can't believe how helpful this site and its members are. Thank you!

Here's my problem:

I have tabbed navigation to move within a page. There are 4 tabs and the HTML is (I had to remove the links to post bc of the spam filter):

<ol id="toc">
    <li><span>Top 3</span></a></li>
    <li><span>Reviews</span></a></li>
    <li><span>Places to Buy</span></a></li>
    <li><span>History</span></a></li>
</ol>

When you click one of those nav links (say, Top 3), you're taken to this:

<div class="tabcontent" id="Top3>
    Here's content
</div>

Thanks to helpful answers on this site, I've been able to append all content in #Getit to the bottom of all the other 'tabcontent' nav areas. But when I use this code:

$('.tabcontent#Getit').clone().appendTo('.tabcontent')

It duplicates the Getit tab within the Getit tab, too. Is there anyway to make it so that if someone is viewing the Getit tab that the content won't be appended there and will only be appended to the other tabcontent classes?

Does toggle work that way?

Upvotes: 0

Views: 115

Answers (1)

JAAulde
JAAulde

Reputation: 19560

jQuery's .toggle() merely sets an element's display to none if the element is currently visible, or sets it to the appropriate value to display the element if the it is currently hidden. It can also be passed a boolean param which says to force display (true) or hide (false) on the element.

I don't see how it's related to this at all.

If I understand the problem you're having, however, (and it's likely I don't...) you should look into the .not() filtration method:

http://jsfiddle.net/vJc6r/1/

var getit = $( '#Getit' );
getit.clone().appendTo( $( '.tabcontent' ).not( getit ) );

Upvotes: 2

Related Questions