проблема выбора jquery, исключая ячейки в нижних делителях

Question

У меня есть древовидная структура, которая отображается в виде таблиц.HTML-код будет выглядеть примерно так:

<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>

Я хочу добавить класс ко всем ячейкам в таблицах непосредственно под div 'tree', но исключить ячейки из таблиц, которые находятся в нижнем div.

Идентификаторы и подобные нижние элементы создаются автоматически, поэтому я не могу их использовать.

До сих пор я получил

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

, который просто добавляет класс квсе клетки.Но я застрял на том, как это исключить.

Спасибо за чтение и, надеюсь, протянуть руку;)

Answer 1

Вам нужен дочерний селектор :

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

Выбирает все прямые дочерние элементы родительского элемента.