Is there a jQuery selector/method to find a specific parent element n levels up?

64,918

Solution 1

The parents function does what you want:

$(this).parents("tr:first");

Solution 2

Also, if you are using jQuery 1.3+ you can use the closest method

$(this).closest("tr");
Share:
64,918
Alan Storm
Author by

Alan Storm

Portland based Web Developer/Programmer/Engineer. Projects include No Frills Magento Layout, the only Magento layout book you'll ever need and Commerce Bug, the debugging extension for the Magento Ecommerce system. If you're interested in low cost, in-depth mentoring/tutoring, checkout my Patreon campaign.

Updated on July 08, 2022

Comments

  • Alan Storm
    Alan Storm almost 2 years

    Consider the following HTML. If I have a JSON reference to the <button> element, how can I get a reference to the outer <tr> element in both cases

    <table id="my-table">
        <tr>
            <td>
                <button>Foo</button>
            </td>
            <td>
                <div>
                    <button>Bar</button>
                </div>
            </td>
        </tr>
    </table>
    
    <script type="text/js">
        $('#table button').click(function(){
            //$(this).parent().parent() will work for the first row
            //$(this).parent().parent().parent() will work for the second row
            //is there a selector or some magic json one liner that will climb
            //the DOM tree until it hits a TR, or do I have to code this myself
            //each time?            
            //$(this).????
        });
    </script>
    

    I know I could special case each condition, but I'm more interested "however deep you happen to be, climb the tree until you find element X" style solution. Something like this, but more jQuery like/less-verbose

    var climb = function(node, str_rule){
        if($(node).is(str_rule)){
            return node;
        }
        else if($(node).is('body')){
            return false;
        }
        else{
            return climb(node.parentNode, str_rule);
        }
    };  
    

    I know about the parent(expr) method, but from what I've seen is allows you filter parents one level up and NOT climb the tree until you find expr (I'd love code example proving me wrong)