READ MORE BUTTON Reveals Content

HTML

<div id="container">
    <a class="more">0 More</a>
    
    <div id="new_feeds">
        
    </div>
</div>

CSS

#container a.more {
    display: block;
    line-height: 3em;
    background-color: #4378ff;
    text-align: center;
    color: #fff;
    cursor: default;
}
p {
    padding: 10px;   
}

JavaScript

var messages = [
    "ed ut tortor odio. Donec ultricies pharetra turpis nec sodales.",
    "Mauris quam neque, laoreet non posuere quis, euismod vitae mi."
    ];


$(".more").html("+" + messages.length + " More");

$(".more").bind("click", function() {

    $(this).fadeOut("slow", function() {
        // append messages one by one
        appendMessageReq();
    });
});

function appendMessageReq() {
    if( messages.length < 1) {
        return; // done
    }

    $("<p style='display:none'>" + messages.pop() + "</p>")
        .prependTo("#new_feeds")
        .slideDown("slow", appendMessageReq);
    
}