html - jQuery toggle with divs hierarchy -



html - jQuery toggle with divs hierarchy -

i'm working on tasks list "hierarchy" (see illustration below):

<div class="holder"> <div class="element"> element #1 </div> <div class="elements"> <div class="holder"> <div class="element"> element #2 </div> <div class="elements"> <div class="holder"> <div class="element"> element #3 </div> <div class="elements"> <!-- empty --> </div> </div> </div> </div> </div> </div>

with next jquery code:

$('div.element').click(function(){ $(this) .closest('div.holder') .find('div.elements') .eq(0) .toggle(); });

question:

it's opening , closing div.elements supposed to, illustration if i'm opening div's, , closing element #1 div - want close every other div.elements within clicked div.holder.

adding fiddle.

working demo

check snippet,

you need hide kid elements too, parent element click.

$('div.element').click(function () { $(this) .closest('div.holder') .find('div.elements') .eq(0) .toggle('fast',function () { $(this).find('div.elements').hide() }); });

jquery html css toggle

Comments

Popular posts from this blog

php - Android app custom user registration and login with cookie using facebook sdk -

django - Access session in user model .save() -

php - .htaccess Multiple Rewrite Rules / Prioritizing -