IE9不是'；t使用jQuery.after将css应用于动态创建的元素

我在一个表的顶部添加了一个div元素，其中包含一些信息，当用户单击某些文本时，我可以通过ajax获得这些信息。我需要在用户单击的记录之后直接显示信息。它在内部使用，所以我只需要支持chrome和IE9。Chrome正在做它需要做的事情，但IE9不喜欢它

我使用jQuery的.after函数将div直接放在用户单击的表行之后。两种浏览器都将div放在了应该放的地方，但是IE9没有将任何css应用到新元素上

 <table>
   <tr><td>blahblah1</td><td class="secondRow">secondRow1</td><td class="thirdRow">thirdrow1</td></tr>
   <tr><td>blahblah2</td><td class="secondRow">secondRow2</td><td class="thirdRow">thirdrow2</td></tr>
   <tr><td>blahblah3</td><td class="secondRow">secondRow3</td><td class="thirdRow">thirdrow3</td></tr>
   <tr><td>blahblah4</td><td class="secondRow">secondRow4</td><td class="thirdRow">thirdrow4</td></tr>
   <div class="ajaxedInfo">control group</div>
   <tr><td>blahblah5</td><td class="secondRow">secondRow5</td><td class="thirdRow">thirdrow5</td></tr>
</table>

$('.secondRow').click(function(){
   $('.ajaxedInfo').remove();
   $('.inlineCSS').remove();
   $(this).parent().after('<div class="ajaxedInfo">ajaxed info coming in about</div>');
});

$('.thirdRow').click(function(){
   $('.ajaxedInfo').remove();
   $('.inlineCSS').remove();
   $(this).parent().after('<div class="inlineCSS" style="position:absolute;background:#c6c6c6;">inline css doesn\'t work either</div>');
});

.secondRow
{
cursor:pointer;
border:1px solid black;
}
.thirdRow
{
cursor:pointer;
}
.ajaxedInfo
{
position:absolute;
background:#cccccc;
width:300px;
text-align:center;
border:1px solid black;
}

Blahblah1第二行第三行1
Blahblah2第二行2第三行2
Blahblah3第二行第三行3
Blahblah4第二行第三行4
对照组
blahblah5secondRow5thirdrow5
$（'.secondRow'）。单击（函数（）{
$（'.ajaxedInfo'）.remove（）；
$（'.inlineCSS'）.remove（）；
$（this.parent（）.after（'ajaxed info in about'）；
});
$（'.thirdRow'）。单击（函数（）{
$（'.ajaxedInfo'）.remove（）；
$（'.inlineCSS'）.remove（）；
$（this）.parent（）.after（'内联css也不起作用'）；
});
.第二排
{
光标：指针；
边框：1px纯黑；
}
蒂德罗先生
{
光标：指针；
}
ajaxedInfo先生
{
位置：绝对位置；
背景:#中交;；
宽度：300px；
文本对齐：居中；
边框：1px纯黑；
}

这是我一直在玩的一把小提琴 这将工作方式，我希望它在铬只是不是IE9

---

我环顾四周，发现IE7做类似的事情似乎有很多问题。人们建议重新绘制元素。我尝试在添加div后隐藏并显示它，但没有帮助。

使用表行

像这样：

$(this).parent().after('<tr class="ajaxedInfo"><td colspan="3">ajaxed info coming in about</td></tr>');

$（this.parent（）.after（'ajaxed info in about'）；

---

--用示例编辑。

你的小提琴在IE9中对我有用。。。你确定这与在表中添加div没有关系（这是无效的？）如果你的小提琴在IE9中为@KevinB工作，也许你已经将IE9设置为IE7模式。我不知道它是无效的，但这说明它是无效的。这很有趣，因为它对你来说很有用IE9@A.Wolff很抱歉。我是新来的。我添加了一个例子，我在他的jfiddle中测试了这个例子，它是有效的。在fiddle中，如果你更改了一些内容，并单击顶部的更新，它将为你提供一个新的url，基本上将4更改为下一个可用的任何数字。看起来我将添加一个tr而不是div。谢谢，谢谢@Kevin B tooThanks@Kevin。添加表行也会更好，因为它没有覆盖下面的行，就像你在Chrome中为我做的例子一样。不过，您可能需要调整CSS位置。