jQuery select parent

Question

I have this html;

<div class="AttachmentContainer">
  <div class="display-label">Attachment name</div>
  <div class="display-field">
    <input type="checkbox" id="chkAttachment" class="Attachment" /> 
    <%= thisAttachment.filename%>                                
  </div>
</div>

And on click of the checkbox i have this jQuery code;

$(this).parent(".AttachmentContainer").hide();

But it doesn't work. If I alert out the html() instead of hide() it's null.

If I change it to;

$(this).parent().parent().hide();

it works fine. I thought putting a selector on the parent would keep moving up until it found the parent with that class name.

I don't want to use parent().parent() so what else is there?

edit

.parents(".... doesn't work either.

Answer 1

You can use the closest method to acheive this:

$(this).closest('.AttachmentContainer').hide();