How can I elegantly select a parent including its set of direct children?
I am working with a mess of HTML markup. To get reliable matches, I have resorted to explicit chaining requests with '>' .
For this question, I am trying to select the parent of an explicit descendant chain.
For example, I would like to select a table element using the class toolbar in the following HTML:
<table class='toolbar'>
<tbody>
<tr>
<td class='button'>
...
</td>
</tr>
</tbody>
</table>
Here's what I've tried:
1. Use 'has'
$("table.toolbar:has(tbody > tr > td.button)")
Here the elements are matched even if the tbody is not a direct child of the table, so this does not work reliably.
2. Use '>' and parent ()
$("table.toolbar > tbody > tr > td.button").parent().parent().parent()
It works, but it's messy. You also need to make sure that the correct number of parent () calls are included.
3. ???
Because of the HTML crap, it is very important that elements are explicitly specified in the request as one direct descendant below the other .
Can anyone please help with the best way to do this? Thanks!
a source to share