Remove divs after 20 using jQuery
<p>Divs of class=message are generated using a post which pulls data and puts it in the page. Now, I want to remove the lower divs after it reaches 20</p>

<pre><code>&lt;div class="message"&gt;test&lt;/div&gt;
&lt;div class="message"&gt;test&lt;/div&gt;
&lt;div class="message"&gt;test&lt;/div&gt;
.
.
.
&lt;div class="message"&gt;test&lt;/div&gt;
</code></pre>

<p>So i need a sort of function to remove the remaining divs (from bottom) as i am adding to the top.</p>

<p>Also when a div appears, I want it to sort of fade in. How do i achieve that? i receive data in chunks so its something like </p>

<pre><code>html = '&lt;div class="messsage"&gt;1&lt;/div&gt;&lt;div class="message"&gt;2&lt;/div&gt;';
</code></pre>

<p>Now I tried this but its really not fading in. i would like it to glow yellow and get back to normal (bonus)</p>

<pre><code>$("#data").prepend(html).fadeIn(2000);
</code></pre>

<p>Thank you for your time.</p>
