jquery - Can't append rows from dynamic table but can append whole table -

i'm not seeing obvious, why can't append part of dynamically generated table (first 2 rows in case) div, can append whole table.

<div id="divarea"></div>      var table = '<table id="abc">';     (var i=0; i<15; i++) {   table += '<tr>';   table += '<td>one</td>';   table += '<td>two</td>';   table += '<td>three</td>';   table += '<td>four</td>';   table += '<td>five</td>';   table += '<td>six</td>';   table += '<td>seven</td>';   table += '<td>eight</td>';   table += '</tr>'; } table += '</table>';  // var limittable = $('#abc tr:lt(2)');  // $('#output').append(limittable);          doesn't work   $('#output').append(table); // works 

edit: table id= "abc" added

jsfiddle

you don't use correct selector. can use:

var limittable = $("tr:lt('2')", table); 

var table = '<table id = "abc">';  (var = 0; < 15; i++) {    table += '<tr>';    table += '<td>one</td>';    table += '<td>two</td>';    table += '<td>three</td>';    table += '<td>four</td>';    table += '<td>five</td>';    table += '<td>six</td>';    table += '<td>seven</td>';    table += '<td>eight</td>';    table += '</tr>';  }  table += '</table>';  //the second parameter provides context  //in search element matched first selector  var limittable = $("tr:lt('2')", table);  $('#output').append(limittable);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>  <div id="output"></div>

also better append table elements table , not in div.