добавить код в определенную ближайшую ячейку
 

Есть сформированный код html

$(".query_table").append('<tr class="tr_query" bgcolor="#'+ color +'"><div class="div_tr"><td align="center">&nbsp;&nbsp;<div class="down_arrow"></div></td><td align="center">'+(e+1)+'</td><td><input class="query_input" style="width:100%" type="text" value="'+ this +'"></td><td align="center" id="site_position_'+e+'" ><img src="/checker/ajax-loader.gif" border="0" /></td></div></tr>'); 
	$(".query_table").append('<tr style="width:100%" class="after_tr" bgcolor="#'+ color +'"></tr>'); 
	$('.after_tr').html('<td style="width:100%" class="after_td" colspan="4">Первая и вторая ячейки< /td>');

Как при нажатии class="down_arrow" добавить этот код

html('<tr class="table_header" width="100%" style="width:100%"><td width="3%" align="center">Выбор</td><td width="3%" align="center">Номер</td><td width="45%">Поисковый запрос(ключевая фраза)</td><td align="center" width="10%">Позиция Вашего сайта</td></tr>');
внутрь class="after_td" соответственно нажимаемому классу

пробую так но не получается
[JS]
$('.down_arrow').click(function(){
	    var $input = $('input[type="text"]', $(this).closest('tr'));
		$(this).closest('tr').next('tr').next('td').html('<tr class="table_header" width="100%" style="width:100%"><td width="3%" align="center">Выбор</td><td width="3%" align="center">Номер</td><td width="45%">Поисковый запрос(ключевая фраза)</td><td align="center" width="10%">Позиция Вашего сайта</td></tr>');

		
		$(this).closest('tr').next('tr').slideDown();
		$(this).removeClass("down_arrow").addClass("up_arrow");
	  


});

[/JS]

решено спасибо find(class)