How to insert multiple table rows after specific row with Jquery? -

i have html table each row has data element. this:

<tr class="logreader-header-row">    <td class="logtable-header" colspan="100%" data-date="2015-05-12">       <img class="logreader-header-controller" src="images/logreader-dropdown.png">       2015-05-12    </td> </tr> <tr class="logreader-header-row">    <td class="logtable-header" colspan="100%" data-date="2015-05-11">       <img class="logreader-header-controller" src="images/logreader-dropdown.png">       2015-05-11    </td> </tr> <tr class="logreader-header-row">    <td class="logtable-header" colspan="100%" data-date="2015-05-07">       <img class="logreader-header-controller" src="images/logreader-dropdown.png">       2015-05-07    </td> </tr> 

every row has onclick event attached to. when user clicks row data attribute being send server ajax request:

$().ready(function(){     $(".logtable-header").each(function(){         $(this).on("click", function(){             var header_row = $(this).parent("logreader-header-row");             $.ajax({                 type: 'post',                 url: url+'admin/ajax_processor/getlog',                 data:{date:$(this).data("date")},                 success: function(response){                     header_row.after(response);                 },                 error: function(request, status, error){                     console.log(request);                     console.log(status);                     console.log(error);                 }             });         });     }); }); 

the ajax response contains html code of subset of table rows generated on server. want insert these rows after 1 has been clicked. here have in ajax response:

<tr class="logtable-oddrow-notice">     <td>2015-04-27</td>     <td>08:55:07</td>     <td>notice</td>     <td>error 404 requested url: "http://localhost/ph-server_mirror/frontend/index/" not found! (user:unidentified[id:-])</td> </tr>  <tr class="logtable-evenrow-notice">     <td>2015-04-27</td>     <td>09:21:08</td>     <td>notice</td>     <td>'test'[id:30] user succesfully logged in.</td> </tr>  <tr class="logtable-oddrow-notice">     <td>2015-04-27</td>     <td>10:13:37</td>     <td>notice</td>     <td>new newsletter created: "teszt 2" user:test[id:30]</td> </tr> 

header_row parent <tr> element of clicked <td> element:

var header_row = $(this).parent("logreader-header-row"); 

but can't insert response after clicked <tr>:

success: function(response){     header_row.after(response); }, 

what doing wrong?

logreader-header-row class, meaning select need prefix . character (the class selector).

var header_row = $(this).parent(".logreader-header-row"); 

otherwise code here searching <logreader-header-row> element.