JQuery Parent() Method - W3Schools

Home » Add Class To Parent Element React Js » JQuery Parent() Method - W3Schools

Maybe your like

jQuery parent() Method

❮ jQuery Traversing Methods

Example

Return the direct parent element of <span>:

$(document).ready(function(){ $("span").parent().css({"color": "red", "border": "2px solid red"});});

Result:

body (great-great-grandparent) div (great-grandparent)
    ul (grandparent)
  • li (direct parent) span
Try it Yourself »

Definition and Usage

The parent() method returns the direct parent element of the selected element.

The DOM tree: This method only traverse a single level up the DOM tree. To traverse all the way up to the document's root element (to return grandparents or other ancestors), use the parents() or the parentsUntil() method.

Tip: To traverse a single level down the DOM tree, or all the way down to the last descendant (to return children or other descendants), use the children() or find() method.

Syntax

$(selector).parent(filter)
Parameter Description
filter Optional. Specifies a selector expression to narrow down the parent search

Try it Yourself - Examples

Return the direct parent of each <span> element How to return the direct parent of each <span> element.

Narrow down the search How to use the filter parameter to return the parent <li> element with class name "first" of each <span>.

Return the direct parent <div> element of each <p> element How to return all the direct parent <div> element of each <p> element.

Show the ancestor elements of an element by tag names A demonstration which shows who the ancestors of a <span> element actually are.

❮ jQuery Traversing Methods

★ +1 Sign in to track progress

Tag » Add Class To Parent Element React Js