5 replies

Selecting only `td` elements from the root table (not nested tables inside the root table)

Hey! i have a ref to a table element and I want to querySelectorAll its td in a certain index. I came up with the following:

tableRef.current.querySelectorAll<HTMLTableCellElement>(
  `tbody tr td:nth-child(${index + 1})`
)

tableRef.current.querySelectorAll<HTMLTableCellElement>(
  `tbody tr td:nth-child(${index + 1})`
)

it works very nicely but it also selects

td

td

elements from nested drawer tables, (which are basically the same table inside a certain

tr

tr

).
I want to select only the

td

td

s of the root table.

Can someone assist me? i'm open to JS and CSS solutions