jquery - removeClass from links in separated div container -


I have some problems that are trying to add / remove a class from links and their siblings. I have & lt; Div class = "collapse_content" & gt; There are 3 groups of links contained in ... & lt; / Div & gt; I was able to get jQuery to add and remove the 'selected' class from the link in the same container, but if I select a link in another container then the previous selected link will be its class Will not be able to overcome

Each link in groups is loading a page in an iframe, so they are all static links. I also have a collapse toggle function in the top of each group of links in jQuery.

Actually, I'm thinking that someone can help me to understand why the selection of jQuery will remove the 'selected' class from the previous link, which is in a different group than the newly selected link .

Any help / suggestions are appreciated, thank you in advance.

Even though I have a code so far.

- jquery -

  $ (function () {// ('click', function (e) {$ (this) .addClass ('selected') O Brother (sister). RemoveClass ('(' selected '';;)); // Toggle class collapse_tab $ (".colapse_tab") with omponenet.click (function () {$ (this) .next (" Collapse_content "). Slide Toggle (500);});}); A   

- HTML -

  
Group 1 gt; div class = "collapse_content"> link 3

link 4 Asp "onclic =" return handlink (this) "& gt; link 4 & lt; / a & gt; & gt; & lt; / div & gt; & lt; div class =" collapse_tab "& gt; ; Group 2 & lt; / div & gt; & lt; div class = "collapse_content" & gt; & Lt; A href = "link 1. asp" onclic = "return handlink (this)" & gt; Link 1 & lt; / A & gt; & Lt; Br> & Lt; A href = "link 2.asp" onclic = "return handlink (this)" & gt; Link 2 & lt; / A & gt; & Lt; Br> & Lt; A href = "link 3. asp" onclic = "return handlink (this)" & gt; Link 3 & lt; / A & gt; & Lt; Br> & Lt; A href = "link 4.asp" onclic = "return handlink (this)" & gt; Link 4 & lt; / A & gt; & Lt; Br> & Lt; / Div & gt; & Lt; Div class = "collapse_tab" & gt; Group 3 & lt; / Div & gt; & Lt; Div class = "collapse_content" & gt; & Lt; A href = "link 1. asp" onclic = "return handlink (this)" & gt; Link 1 & lt; / A & gt; & Lt; Br> & Lt; A href = "link 2.asp" onclic = "return handlink (this)" & gt; Link 2 & lt; / A & gt; & Lt; Br> & Lt; A href = "link 3. asp" onclic = "return handlink (this)" & gt; Link 3 & lt; / A & gt; & Lt; Br> & Lt; A href = "link 4.asp" onclic = "return handlink (this)" & gt; Link 4 & lt; / A & gt; & Lt; Br> & Lt; / Div & gt; & Lt; Div class = "collapse_tab" & gt; Group 4 & lt; / Div & gt; & Lt; Div class = "collapse_content" & gt; & Lt; A href = "link 1. asp" onclic = "return handlink (this)" & gt; Link 1 & lt; / A & gt; & Lt; Br> & Lt; A href = "link 2.asp" onclic = "return handlink (this)" & gt; Link 2 & lt; / A & gt; & Lt; Br> & Lt; A href = "link 3. asp" onclic = "return handlink (this)" & gt; Link 3 & lt; / A & gt; & Lt; Br> & Lt; A href = "link 4.asp" onclic = "return handlink (this)" & gt; Link 4 & lt; / A & gt; & Lt; Br> & Lt; / Div & gt;

- css -

 . Collapse_tab {text-decoration: none; font-weight: bold; Background color: # 0cf; Color: #fff; Font-size: 11px; Padding: 2px; Margin: 0px; Text-align: center; Border: 1px solid # 09f; Cursor: indicator; }. Collapse_content {font: Vardana, Ariel, Helvetica, Sense-Serif; Margin: 0 px; Padding: 0 pixels; Font-size: 10px; Background color: # 0cf; Limit: #FFF1px solid; }a????    

try it

  $ (function () Add the 'selected' class to the tag on {// class collapse_content $ ('.colapse_content a') (click on 'click', function (e) {$ ('.colapse_content a'). RemoveClass ('selected') Toggle componenet with $ (this) .addClass ('selected');}; // class collapse_tab $ (".colapse_tab"). (Function () ($ (this) .next (". Collapse_content") Slide Toggle (500);});}); A ????    

Comments