title: Why I'm getting the error "Error: Syntax error, unrecognized expression: unsupported pseudo: select"?
body: <p>I've following jQuery code:</p>
  
  <pre><code>    $(document).ready(function() {
      $('.products').click(function () {
        var table_id = $(this).closest('table').attr('id');            
        var no = table_id.match(/\d+/)[0];            
        var first_row = $(this).closest('table').find('tbody tr:first').attr('id');    
        var new_row = $('#'+first_row).clone();
        var tbody = $('tbody', '#'+table_id);
        var n = $('tr', tbody).length  + 1;
        new_row.attr('id', 'reb' + no +'_'+ n);
  
        $(':input', new_row).not('.prod_list').remove();
        $(':select', new_row).attr('name','product_id_'+no+'['+n+']');
        $(':select', new_row).attr('id','product_id_'+no+'_'+n);
        $('&lt;button style="color:#C00; opacity: 2;" type="button" class="close delete" data-dismiss="alert" aria-hidden="true"&gt;&amp;times;&lt;/button&gt;').appendTo( $(new_row.find('td:first')) );
        tbody.append(new_row);
        $('.delete').on('click', deleteRow);
       });
     });
  </code></pre>
  
  <p>Using above code I'm appending a new to the HTML table. But this row is containing only select control. So I'm setting the values of id and name to that select control using above code. During this I got Syntax error as follows in firebug console:</p>
  
  <pre><code>"Error: Syntax error, unrecognized expression: unsupported pseudo: select"
  </code></pre>
  
  <p>If I remove the above two lines I wrote to set the id and name values to select control, other code works absolutely fine without any issue. So can some one please fix this issue and allow me to set the id and value of newly created row's select control? Thanks</p>