Note that there are some explanatory texts on larger screens.

plurals
  1. POmy jquery does not work
    primarykey
    data
    text
    <p>I am creating a wordpress site, in which I have design tabs. I want that when I click on first tab, it should display the contents of the div with id=tab1.</p> <p>And when I click on the second tab it should display the cotent of the div with id=tab2.</p> <p>But nothing is working.</p> <p>Here is my jquery code.</p> <pre><code>$(document).ready(function() { //Hide all content $(".tab_content").hide(); //Activate first tab $(".tabs_links ul li:first").addClass("active").show(); //Show first tab content $(".tab_content:first").show(); //On Click Event $(".tabs_links ul li").click(function() { //Remove any "active" class $(".tabs_links ul li").removeClass("active"); //Add "active" class to selected tab $(this).addClass("active"); //Hide all tab content $(".tab_content").hide(); //Find the rel attribute value to identify the active tab + content var activeTab = $(this).find("a").attr("href"); //Fade in the active content $(activeTab).fadeIn(); return false; }); }); </code></pre> <p>and here is my html code.</p> <pre><code>&lt;div class="tabs_links"&gt; &lt;ul&gt; &lt;li&gt;&lt;a href="#tab1"&gt;News and Events&lt;/a&gt;&lt;/li&gt; &lt;li&gt;&lt;a class="nobg" href="#tab4"&gt;Blog&lt;/a&gt;&lt;/li&gt; &lt;/ul&gt; &lt;/div&gt; &lt;div style="display: none;" id="tab1" class="tab_content"&gt; content of first tab &lt;/div&gt; &lt;div style="display: none;" id="tab4" class="tab_content"&gt; content of second tab &lt;/div&gt; </code></pre> <p>I don't know what is the problem. Does anyone know the solution?</p>
    singulars
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
 

Querying!

 
Guidance

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