closest()

This function gets the first parent element that matches a selector, by testing the element itself and traversing up through its ancestors in the DOM tree. (In HTML, a parent is an element that contains another element.)

The function can be used for:

• The elements that match the selector of a script (see results).
• One element that matches the selector of a script that runs for "Each matched element" (see this and Setting the scope of a script).
• The elements returned by a query in the template (see query()).

To get a child element or all child elements, use children() (see children()).

The closest() command is based on the closest() command found in the jQuery library: https://api.jquery.com/closest/.

To get an element's sibling element, you can use prev() or next().

closest(selector)

For one HTML element or for each element in a set, this function gets the first element that matches the selector by testing the element itself and traversing up through its ancestors in the DOM tree.

selector

A String containing an HTML tag (without the angle brackets, <>).

Examples

The following script looks up all table rows in the template that contain an <input> element.

query("input").closest("tr");

This code gets the closest 'parent' row for each element that matches the selector of the script (collected in the results object):

results.closest("tr");

The rows could be colored red within the same statement:

results.closest("tr").css('background-color','red');