jQuery select only tr in main table, not nested tables
<p>I currently have a table with a nested table in it:</p>

<pre><code>   &lt;table class="datagrid" id="report"&gt;
       &lt;thead&gt;
         &lt;tr&gt;
          &lt;th&gt;item1&lt;/th&gt;
          &lt;th&gt;item2&lt;/th&gt;
         &lt;/tr&gt;
       &lt;/thead&gt;
       &lt;tbody&gt;
       &lt;tr class="odd"&gt; &lt;-- on click from this level only 
        &lt;td&gt;&lt;/td&gt;  
        &lt;td&gt;&lt;/td&gt;
       &lt;/tr&gt;
       &lt;tr&gt;
        &lt;td colspan="2"&gt;
         &lt;table&gt;
          &lt;tr class="odd"&gt; &lt;-- not to be fired here
           &lt;td&gt;&lt;/td&gt; 
</code></pre>

<p>etc table structure. </p>

<p>I am currently using the following jQuery, which fires on every <code>tr</code> regardless of the table level. How do I change it to only fire on the first level?</p>

<pre><code> $(document).ready(function(){
            $("#report tr:not(.odd)").hide();
            $("#report tr:first-child").show();

            $("#report tr.odd").click(function(){
                $(this).next("#report tr").fadeToggle(600);
            });
        });
</code></pre>
