jQuery closest element with an attribute that contains a value

Question

I have some HTML code that looks like this:

<tr id="nbContent_GR1">...</tr>
<tr id="nbContent_GR2">...</tr>
<tr id="nbContent_GR3">...</tr>
<tr id="nbContent_GR4">...</tr>
<tr id="nbContent_GR5">...</tr>
<tr id="nbContent_GR6">...</tr>

Within one of the rows, I want to traverse up the DOM to find the closest element that has an ID attribute that starts with "nbContent_GR". So basically I want to be able to find the parent TR element without knowing its exact ID, just the first one that starts with "nbContent_GR". Is this possible? If so, how would I go about it?

BTW, I'm aware of the closest() and "contains" selectors, just not sure if contains can be used on attribute values or not.

Answer 1

Just do:

tr = $(this).closest("[id^='nbContent_GR']");

that will traverse the DOM up until it finds a parent with ID starting with 'nbContent_GR'

Answer 2

.closest('[id^="nbContent_GR"]')

Answer 3

Two useful pages to look at:

http://api.jquery.com/closest/

http://api.jquery.com/attribute-starts-with-selector/

I think you can combine these for a solution.

From within the TR, find the closest TR. Then use the 'starts with' selector to find an ID which starts with your required value.

E.g.:

$(this).closest("tr").parent().find("id^='nbContent_GR'");