Databases
StackOverflow2013
Postsdbo
POjQuery add active tab class to the Body tag
Body
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POjQuery add active tab class to the Body tag
    text
    copied!<p>On the website im building, each tab has a class on its li of either tab1, tab2, tab3 etc</p> <p>What I want to do is first check to see if a tab has a class of "cur" then if it does, check the rest of the li to see if it has another class of either "tab1", "tab2", "tab3", "tab4" or "tab5" then add that "tab" class to the body tag </p> <p>to get get something like this</p> <pre><code>&lt;body class="tab2"&gt; &lt;div class="nav"&gt; &lt;ul&gt; &lt;li class="current1 tab1"&gt;First Tab&lt;/li&gt; &lt;li class="current1 cur sub tab2"&gt;Second Tab&lt;/li&gt; &lt;li class="current1 sub tab3"&gt;Third Tab&lt;/li&gt; &lt;li class="current1 sub tab4"&gt;Fouth Tab&lt;/li&gt; &lt;li class="current1 sub tab5"&gt;Fifth Tab&lt;/li&gt; &lt;/ul&gt;&lt;/div&gt; </code></pre> <p>i've tried something like the jQuery below but it always adds an additional class of tab5 to the body as well </p> <pre><code> if ( $('.navigation ul li.tab1').hasClass('cur') ) { $('body').addClass('tab1'); } else if ( $('.navigation ul li.tab2').hasClass('cur') ) { $('body').addClass('tab2'); } else if ( $('.navigation ul li.tab3').hasClass('cur') ) { $('body').addClass('tab3'); } else if ( $('.navigation ul li.tab4').hasClass('cur') ) { $('body').addClass('tab4'); } else ( $('.navigation ul li.tab5').hasClass('cur') ); { $('body').addClass('tab5'); } </code></pre> <p>I know there is a much cleaner way of doing it but can't seem to work it out</p> <p>I wish I could just add the class manually, but i dont have access to the HTML so have to generate it with javaScript</p> <p>Any help much appreicated</p> <p>Thanks </p>
 

Querying!

 
Guidance
An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload