CSS selector for innermost TABLEs?

Question

Is there any way to select only innermost tables? That is ones that do not contain any more tables inside them?

I know I can filter by element.getElementsByTagName("table").length == 0, I'm just wondering if there's a more elegant solution.

Answer 1

With pure CSS you can't do this. With jQuery (which your question is tagged with) you can:

$("table:not(:has(table))")...

will select tables with no child tables.

The :has() selector finds elements elements that have a particular descendant. :not() inverts the selection to those that don't have that particular descendant.