jQuery-Auswahlproblem mit Ausnahme von Zellen in niedrigeren divs - jquery, jquery-selectors

Ich habe eine Baumansicht, die als Tische dargestellt wird. Die HTML wäre so etwas wie:

<div id="tree">
<table><tr><td></td><td></td><td></td></tr></table>
<div>
<table><tr><td></td><td></td><td></td></tr></table>
</div>
<table><tr><td></td><td></td><td></td></tr></table>
<div>
<table><tr><td></td><td></td><td></td></tr></table>
<table><tr><td></td><td></td><td></td></tr></table>
</div>
<table><tr><td></td><td></td><td></td></tr></table>
<table><tr><td></td><td></td><td></td></tr></table>
<div>
<table><tr><td></td><td></td><td></td></tr></table>
<table><tr><td></td><td></td><td></td></tr></table>
</div>
</div>

Ich möchte allen Zellen in den Tabellen direkt unter div "tree" eine Klasse hinzufügen, aber die Zellen aus den Tabellen ausschließen, die sich in einem niedrigeren div befinden.

Ids und solche der unteren Divs werden automatisch erstellt, sodass ich diese nicht verwenden kann.

Was ich bisher bekommen habe, ist

$("#tree table td").addClass("custom");

Das fügt die Klasse allen Zellen hinzu. Aber ich stehe fest, wie ich das ausschließen kann.

Danke fürs Lesen und hoffentlich auch Hand anlegen;)

Antworten:

Du brauchst das Kinderselektor:

$("#tree > table td").addClass("custom");

Es werden alle direkten untergeordneten Elemente des übergeordneten Elements ausgewählt.