Question

Okay, so basically I can’t get it to work with parent as the class isn’t in the parent div.

CSS:

.contentSlide{
    display:none;
}

HTML:

<div class="contentSlide">
    <p>Members image on left and comments on the right. Date floated on right, and link to user.</p>
</div>

<div id="button" class="open">Comments(6) &#x25bc;</div>

JS:

$(".open").live('click',function(){
    $(this).parent(".contentSlide").slideDown();
    $(this).html("Close \u25b2 <span style='float:right;' onclick='reply=true;' class='reply'>Post a <a href='javascript:void(0);'>comment</a></span>").removeClass("open").addClass("close");
});

Basically, we want the div class “open” to make the “contentSlide” div slideDown if it is clicked.

We don’t want to use $(".contentSlide").slideDown(); as we want this to be global in the event that we have more than one of these contentSlide divs displaying on the page.

Answer 1

In the case of the HTML you’ve provided and that it’s all we have to go by, you would want to use the .prev() function.

$(this).prev().slideDown();

But I would suggest giving it an ID of some sort or a data type.