jQuery:将元素附加到动态生成的元素

Question

我有以下动态生成的 HTML - 我在 firebug 中看到此 html 代码，但当我右键单击并查看页面源代码时却看不到

     <table id="list2" class="ui-jqgrid-btable" cellspacing="0" cellpadding="0" border="0" tabindex="1" role="grid" aria-multiselectable="true" aria-labelledby="gbox_list2" style="width: 1405px;">

<tr id="1" class="ui-widget-content jqgrow ui-row-ltr" role="row" tabindex="-1">
<td aria-describedby="list2_action" title="" style="text-align:center;" role="gridcell">
    <img height="22" width="22" alt="Edit" title="Edit" style="vertical-align:middle" src="images/action_icon.gif">
        </td>
</tr>
<tr id="2" class="ui-widget-content jqgrow ui-row-ltr" role="row" tabindex="-1">
<td aria-describedby="list2_action" title="" style="text-align:center;" role="gridcell">
    <img height="22" width="22" alt="Edit" title="Edit" style="vertical-align:middle" src="images/action_icon.gif">
        </td>
</tr>
</table>

采用上面的代码，我想在 img 元素后面动态添加一个 div 元素，以便每个表格行都有以下代码

<td aria-describedby="list2_action" title="" style="text-align:center;" role="gridcell">
    <img height="22" width="22" alt="Edit" title="Edit" style="vertical-align:middle" src="images/action_icon.gif">
<div>test</div>
        </td>

我尝试过 .append()、.add()、.insertAfter() 但没有任何效果。

请帮忙!有没有办法在没有事件处理程序的情况下使用 .live() ？

这也不起作用，它位于正文结束标记之前的右下角。

$(document).ready(function(){
    $("img[alt='Edit']").after("<div style='background-color:yellow;'>test</div>");

});

Answer 1

您想使用after :

Insert content, specified by the parameter, after each element in the set of matched elements.

类似于:

$('td img').after('<div>test</div>');

演示:http://jsfiddle.net/ambiguous/Lt6ku/

当然，您可能需要调整 td img 选择器以匹配您的 HTML。