jQuery Tutorial Tutorials - jQuery .parent() method

jQuery .parent() method

The .parent() method in jQuery is used to get the parent of each element in the set of matched elements.

jQuery .parent() method Syntax

.parent(selector)

jQuery .parent() method Example

example

Find the parent element of the item with an id "python".

HTML

<ul>
    <li class="category">Language
        <ul>
            <li class="lang">Java
                <ul>
                    <li>Java tutorial</li>
                    <li>Java Examples</li>
                </ul>
            </li>
            <li class="lang">Python
                <ul id="python">
                    <li>Python tutorial</li>
                    <li id="pyex">Python Examples</li>
                </ul>
            </li>
        </ul>
    </li>
    <li class="category">Tools</li>
    <li class="category">Lautturi</li>
</ul>

jQuery

$( "#python" ).parent().css( "background-color", "cyan" );

Result

[<li class="lang">Python</li>]

Try now

example

Find the <ul> tag's parent element which with a class category.

HTML

<ul>
    <li class="category">Language
        <ul>
            <li class="lang">Java
                <ul>
                    <li>Java tutorial</li>
                    <li>Java Examples</li>
                </ul>
            </li>
            <li class="lang">Python
                <ul id="python">
                    <li>Python tutorial</li>
                    <li id="pyex">Python Examples</li>
                </ul>
            </li>
        </ul>
    </li>
    <li class="category">Tools</li>
    <li class="category">Lautturi</li>
</ul>

jQuery

$( "ul" ).parent('.category').css( "background-color", "cyan" );

Result

[<li class="category">Language</li>]
Date:2019-08-26 14:03:52 From:www.Lautturi.com author:Lautturi