after() with fadein() jquery doesn't work
<p>I am trying to append some extra rows to my table, but can't make it fancy with fadein().
As you can see mine is applying the fade in effect to the very first row.</p>

<p><a href="http://jsfiddle.net/r5q6r/" rel="nofollow">Jsfiddle example</a></p>

<p>How can I apply the fadein to my other 3 rows??</p>

<p>I  switched the places of the methods, but no success</p>

<pre><code>$("input").click(function () {
    $("table tr:last")
        .hide()
        .after("&lt;tr&gt;&lt;td&gt;SecondRow&lt;/td&gt;&lt;/tr&gt;&lt;tr&gt;&lt;td&gt;ThirdRow&lt;/td&gt;&lt;/tr&gt;&lt;tr&gt;&lt;td&gt;ForthRow&lt;/td&gt;&lt;/tr&gt;")
        .fadeIn(1000);
});
</code></pre>
