jQuery click is not bubbling up to parent -


When div.arrow is clicked, its organs should toggle and collapsed content Should expand / collapse It's working, but the click event on div.arrow does not bubble about its parents, li.level1 .

html on a related note, how can I get a brother, span for inclusion in this bubble? ? & lt; ul id = "list" & gt; & Lt; Li class = "level 1" & gt; Div square = "arrow arrow-down" & gt; & Lt; / Div & gt; Exact match & lt; Ul id = "ul_first" class = "level1a" & gt; & Lt; Li & gt; & Lt; P & gt; GE & lt; / P & gt; Ab Ilo Inventore: ASJK: (2365) & lt; / li & gt; & Lt; Li & gt; & Lt; P & gt; GE & lt; / P & gt; Doloram: POOJ: (98, 4454) & lt; / li & gt; & Lt; Li & gt; Eak & lt; B & gt; GE & lt; / B & gt; Ipsa Quae & lt; / li & gt; & Lt; Li & gt; Porro quixem & lieutenant; B & gt; GE & Lt; / B & gt; Location & lt; / li & gt; & Lt; Li & gt; Sit Voluptatem & lt; B & gt; GE & lt; / B & gt; & Lt; / li & gt; & Lt; / Ul & gt; & Lt; / li & gt; & Lt; Li class = "level 1" & gt; Div class = "arrow-right"> gt; & Lt; / Div & gt; Consultant & lt; Span & gt; (7) & lt; / Span & gt; & Lt; ul class = "level1a" & gt; & Lt; Li & gt; B sick & lt; B & gt; GA & lt; / B & gt; O inventor & lt; / li & gt; & Lt; Li & gt; & Lt; P & gt; GE & lt; / P & gt; usantium & lt; / li & gt; & Lt; Li & gt; Esparnitur O & lt; B & gt; GA & lt; / B & gt; & Lt; / li & gt; & Lt; Li & gt; Beta & lt; B & gt; GA & lt; / B & gt; E Life Dicta & lt; / li & gt; & Lt; Li & gt; Consequentur & lt; P & gt; GE & lt; / P & gt; & Lt; / li & gt; & Lt; Li & gt; Geloremque & lt; / li & gt; & Lt; Li & gt; Geque Ipsa Quae & lt; / li & gt; & Lt; / Ul & gt; & Lt; / li & gt;

CSS

  li.level1 .arrow-down, li.level1 .arrow- Correct {width: 0; Height: 0; Status: Completed; } Li.level1 .arrow-down {border-left: 5px solid transparent; Border-right: 5px solid transparent; Border-top: 7px solid # 444; Left: -16px; Top: 7px; } Li.level1 .arrow-right (border-top: 5px solid transparent; border bottom: 5px solid transparent; border-left: 7px solid # 444; left: -12 pixel; top: 5px;}   

js

  $ ('div.arrow'). (Function () {var arrow right = $ (This) .hasClass ('arrow-right'); var arrowDown = $ (this) .hasClass ('arrow-down'); console.log ("R:" + arrowRight); console ("D:" + arrowDown; $ (this). parent () children ('ul.level1a'). slide toggle (); if (sharpened) {$ (this) .removeClass ('arrow-right') .addClass ('arrow- Down ');} and if (the arrowhead) {$ (this) .removeClass (' arrow-down '). AddClass (' arrow-right ');};}) ;    

Check the demo here,

$ ( This). Parents (). Children ('span.sibling') to select multiples

Comments

Popular posts from this blog

Java - Error: no suitable method found for add(int, java.lang.String) -

java - JPA TypedQuery: Parameter value element did not match expected type -

c++ - static template member variable has internal linkage but is not defined -