html - trying to replace a div with jquery slideDown click method -
i trying replace div 1 once element has been clicked, cant seem working. have included html , jquery code below. element trying slide in has css property of display: none.
html:
<div class="meal-details"> <h4>heading</h4> <h5 class="optiontabs meal-description">description</h5> <h5 class="optiontabs nutrition-description">nutritional info</h5> <div class="nutrition-breakdown"> <p>text one</p> </div> <div class="meal-breakdown"> <p>text two</p> </div> </div>
jquery:
$(".nutrition-description").click(function(){ $(this).find(".nutrition-breakdown").slidedown("fast"); });
can see preventing sliding down? of course appreciated!
reason code isn't working because using .find() method find container "nutrition-breakdown" inside "nutrition-description", not correct, "nutrition-breakdown" sibling of "nutrition-description"
kindly use below code fit requirement.
$(".nutrition-description").click(function(){ $(this).next().slidedown("fast");//change
});
if dont need animation better tp use .show() instead of slidedown().
Comments
Post a Comment