jquery selection problem excluding cells in lower divs

I have a treeview that renders as tables. The html would be something like:

<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>&l开发者_JAVA百科t;/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>

I want to add a class to all the cells in the tables directly under div 'tree', but exclude the cells from the tables that are in a lower div.

Id's and such of the lower divs are created automatically so I cannot use these.

What I have gotten so far is

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

which just adds the class to all the cells. But I am stuck on how to exclude this.

Thanks for reading and hopefully lending a hand ;)

You need the child selector:

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

It selects all direct children of the parent element.