Edit in JSFiddle

$.fn.textarea = function(){
    function init(){
        var d = $(this).wrap('<div></div>');
        var p = $('<pre></pre>').html(d.val()).insertAfter(d);
        d.bind('keyup change click focus',function(e){
            p.html(d.val());
        });
    }
    return this.each(init);
};
$('textarea').textarea();

div{
    width:200px;
    position:relative;
    font-size:12px;
    line-height: 1.5em;
    margin:50px;
}
div textarea{
    width:100%;
    min-height:100%;
    display:block;
    position:absolute;
    font-size:12px;
    line-height: 1.5em;
    padding: 0px;
    resize: none;
}
div pre{
    display:block;
    min-height: 50px;
    font-size:12px;
    line-height: 1.5em;
    padding-top:1em;
    white-space: pre-wrap;
    word-wrap: break-word;
}

<textarea></textarea>