Question

Possible Duplicate:
jQuery: find all the parents up to a specific parent

I have the following:

<div class="modal-window block-border">
    <ul class="action-tabs right">
        <li><a title="Close window" href="#"><img width="16" height="16" src="images/icons/fugue/cross-circle.png"></a></li>
    </ul>
    <div class="block-content no-title">
        <div style="min-width: 200px; min-height: 40px; width: 300px; height: 221px;" class="modal-content modal-scroll">
            <h1>Admin</h1>
            <div class="block-header">
                Please login
            </div>
            <form novalidate="novalidate" action="/MyAccount/Access/JsonLogin" data-ajax="true" data-ajax-method="POST" data-ajax-mode="replace" data-ajax-success="dialogSuccess()" data-ajax-update="#update-message" name="login-form" id="login-form" method="post">

I have a reference to the form which is $(this). Given this reference how can I find a reference to the class with the top most div called “modal-window” ?

Answer 1

Because you might not be sure of exactly how far the target element is from the current element, and assuming you only want to find one target element:

$(this).closest('.modal-window');

• parent() selects the immediate-parent element of $(this), returns a jQuery object of one, or none.
• parents() selects all matching ancestor elements of $(this), returns a jQuery object of one, none or many.
• closest() selects the first element matching the selector in the DOM ‘tree’ above the $(this), returns a jQuery object of one, or none.