title: jQuery nth-child selector
body: <p>Got a small confusing issue with jQuery and selecting/styling a column in a table.</p>
  
  <p>The following code works:</p>
  
  <pre><code>   $(function() {
        $("table").delegate('th.selcol','click', function(e) {
           var iCol = $(this).parent().children().index(this)+1;
           $("table tr td:nth-child(10)").each(function () {
              $(this).toggleClass("colhighlight");
           });
        });
     });
  </code></pre>
  
  <p>But this code, changing the nth-child(10) to nth-child(iCol) produces an error 
  "uncaught exception: Syntax error, unrecognized expression: :nth-child"</p>
  
  <pre><code>   $(function() {
        $("table").delegate('th.selcol','click', function(e) {
           var iCol = $(this).parent().children().index(this)+1;
           $("table tr td:nth-child(iCol)").each(function () {
              $(this).toggleClass("colhighlight");
           });
        });
     });
  </code></pre>
  
  <p>Any help would be greatly appreciated.</p>