javascript - Hide siblings and parent's siblings until the given id using JQuery -
i trying expand inner div due space issues on button click. when user clicks on button, want hide siblings , parent's siblings until specified id. how in javascript using jquery?
following example:
dom:
<div id="p"> <div id="p1-1"> <div id="c1-1-1"> <button id="expand"></button> </div> <div id="c1-1-2"> </div> </div> <div id="p1-2"> <div id="c1-2-1"> </div> </div> <div id="p1-3"> <div id="c1-3-1"> </div> </div> </div>
result dom:
<div id="p"> <div id="p1-1"> <div id="c1-1-1"> <button id="expand"></button> </div> </div> </div>
find elements want keep visible using parentsuntil(), loop through them using each(), hide siblings().
$(button).click(function(){ var elementstokeep = $(this).parentsuntil('#stop_element_id'); elementstokeep.each(function(){ $(this).siblings().hide(); }); });
not enough rep post link siblings().
Comments
Post a Comment