title: jQuery selectors for even/odd rows in a table
body: <p>The code in the first Code Block is the source code. After the source code is running. The code will be changed (See the 2nd Code Block).</p>
  
  <p>I want the class(i.e. 'even' and 'odd') of  tag is only displayed in the 'table1'. However, currently a nest table (i.e. 'table2') also has 'even' and 'odd' class of each  tag.</p>
  
  <p>Can anyone help me out? Thanks in advance.</p>
  
  <p><strong>-----------First Code Block--------------</strong></p>
  
  <pre><code>&lt;head&gt;
  &lt;script type="text/javascript"&gt;
              $(document).ready(function(){
                  $("#table1 tr:odd").addClass("odd");
                  $("#table1 tr:not(.odd)").addClass("even");  
              });
  &lt;/script&gt;
  &lt;/head&gt;
  
  &lt;body&gt;
  
  &lt;table id="table1"&gt;
      &lt;tr&gt;
          &lt;td&gt;AAA&lt;/td&gt;
          &lt;td&gt;CCC&lt;/td&gt;
      &lt;/tr&gt;
      &lt;tr&gt;
          &lt;td&gt;BBB&lt;/td&gt;
          &lt;td&gt;DDD&lt;/td&gt;
      &lt;/tr&gt;
      &lt;tr&gt;
          &lt;td&gt;
              &lt;table id="table2"&gt;
                     &lt;tr&gt;&lt;/tr&gt;
                     &lt;tr&gt;&lt;/tr&gt;
              &lt;table&gt;
          &lt;/td&gt;
      &lt;/tr&gt;
  
  &lt;/table&gt;
  &lt;/body&gt;
  </code></pre>
  
  <p><strong>-----------2nd Code Block---------------</strong></p>
  
  <pre><code>&lt;table id="table1"&gt;
      &lt;tr class="even"&gt;
          &lt;td&gt;AAA&lt;/td&gt;
          &lt;td&gt;CCC&lt;/td&gt;
      &lt;/tr&gt;
      &lt;tr class="odd"&gt;
          &lt;td&gt;BBB&lt;/td&gt;
          &lt;td&gt;DDD&lt;/td&gt;
      &lt;/tr&gt;
      &lt;tr class="even"&gt;
          &lt;td&gt;
              &lt;table id="table2"&gt;
                     &lt;tr class="even"&gt;&lt;/tr&gt;
                     &lt;tr class="odd"&gt;&lt;/tr&gt;
              &lt;table&gt;
          &lt;/td&gt;
      &lt;/tr&gt;
  
  &lt;/table&gt;
  </code></pre>