jquery - Showing multiple elements onClick -

HTML:

  & lt; ul आईडी = "मोड" & gt; & Lt; li & gt; & lt; a href = "# टैब 1" & gt; टैब 1 & lt; / a & gt; & Lt; div वर्ग = "अतिरिक्त" & gt; tada & lt; / div & gt; & Lt; / li & gt; & Lt; li & gt; & lt; a href = "# टैब 2" & gt; टैब 2 & lt; / a & gt; & Lt; div वर्ग = "अतिरिक्त" & gt; tada & lt; / div & gt; & Lt; / li & gt; & Lt; / ul & gt; & Lt; div id = "tab1" class = "tab-content" शैली = "प्रदर्शन: कोई नहीं" & gt; सामग्री 1 & lt; / div & gt; & Lt; div id = "tab2" class = "tab-content" शैली = "प्रदर्शन: कोई नहीं" & gt; सामग्री 2 & lt; / div & gt;  

jQuery:

  $ (फ़ंक्शन () {var मोड = $ ('# मोड'); var arrow = $ ('& lt; span $ '(' ली ए ', मोड) .bind (' click.mytabs ', function () {$ (' li ', मोड) .removeClass (' $ (यह)। Parent ()। AddClass ('सक्रिय')। ऐप (ऐरो); var a = $ (this) .attr ('href'); $ ('tab-content') छिपाने (); $ (ए)। दिखाएं (); वापसी वापस;})। फ़िल्टर (': पहले')। ट्रिगरहाण्डलर ('click.mytabs'); // eq (0) के रूप में भी कार्य करता है);  

जेएसएफडियल यहाँ:

मैं क्लिक पर प्रत्येक ली के 'अतिरिक्त' डिवेल को भी दिखाना चाहता हूं और जब टैब निष्क्रिय है, तो मुझे क्या बदलना होगा कोड में?

धन्यवाद!

  $ (फ़ंक्शन () {Var मोड = $ ('# मोड'); var arrow = $ ('& lt; span / & gt;', {'class': 'arrow'}); $ ('li a', मोड) .bind (' $ ('ली', मोड)। $ ('ली', मोड) .हाइड (); $ (यह)। साइबिंग ('डिवि')। शो (); $ ('ली', मोड) .removeClass 'सक्रिय'); $ (यह)। Parent ()। AddClass ('सक्रिय')। ऐप (एरो); var a = $ (this) .attr ('href'); $ ('टैब-सामग्री') ; (ए); (ए); झूठी वापसी;})। फ़िल्टर (': पहले')। ट्रिगरहाण्डलर ('click.mytabs'); // eq (0) के रूप में भी काम करता है);