Jquery this Child Selector

Question

I m using this   jQuery   class1 a   click  function       if      class2   is   hidden              class2   slideDown  slow        else           class2   slideUp              On page structure    lt div class  class1  gt     lt a href       gt text lt  a gt     lt div class  class2  gt text lt  div gt   lt  div gt    It only works when you don t have multiple class1 class2 sets like    lt div class  class1  gt     lt a href       gt text lt  a gt     lt div class  class2  gt text lt  div gt   lt  div gt   lt div class  class1  gt     lt a href       gt text lt  a gt     lt div class  class2  gt text lt  div gt   lt  div gt   lt div class  class1  gt     lt a href       gt text lt  a gt     lt div class  class2  gt text lt  div gt   lt  div gt    How do I change the initial jquery code so that it only effects class2 under the class1 that was clicked  I tried recommendations from How to get the children of the   this  selector  but haven t succeeded

User · Accepted Answer

The best way with the HTML you have would probably be to use the next function, like so:

var div = $(this).next('.class2');

Since the click handler is happening to the <a>, you could also traverse up to the parent DIV, then search down for the second DIV. You would do this with a combination of parent and children. This approach would be best if the HTML you put up is not exactly like that and the second DIV could be in another location relative to the link:

var div = $(this).parent().children('.class2');

If you wanted the "search" to not be limited to immediate children, you would use find instead of children in the example above.

Also, it is always best to prepend your class selectors with the tag name if at all possible. ie, if only <div> tags are going to have those classes, make the selector be div.class1, div.class2.

User · Answer

This is a lot simpler with  slideToggle     jQuery   class1 a   click  function         this  next   class2   slideToggle          EDIT  made it  next instead of  siblings  http   www mredesign com demos jquery-effects-1   You can also add cookie s to remember where you re at     http   c hadcoleman com 2008 09 jquery-slide-toggle-with-cookie

User · Answer

http   jqapi com  Traversing--  Tree Traversal --  Children

User · Answer

In the click event  this  is the a tag that was clicked  jQuery   class1 a   click  function        var divToSlide     this  parent   find   class2       if  divToSlide is   hidden            divToSlide slideDown  slow         else         divToSlide slideUp               There s multiple ways to get to the div though you could also use  siblings   next etc

[jquery] Jquery $(this) Child Selector

Examples related to jquery

Examples related to css-selectors

Examples related to children