How to insert a tag when exceeding the 140 limit, i.e. Negative?

Question

Is it possible to somehow put on the characters that were entered when the user exceeded the limit of 140 characters and is now at -1 minus, etc. Like, change the background of the text to be red.

$(".comment-box").keydown(function () {
    var parent = $(this).parent();
    var text_max = 140;
    var length_reached = $(this).val().length;
    var remaining = text_max - length_reached;

    $(parent).find('.counter').html(remaining);

    if (remaining < 5 || remaining >= text_max) $(parent).find(".btn").prop("disabled", true);
    else $(parent).find(".btn").prop("disabled", false);
 });

Here is my fiddle: http://jsfiddle.net/3sCfG/56/

EDIT: wrapping or wrapInner is useful, I use the keyup event, which can be a problem as it adds too many em tags, is there a good solution to get every char after 140 limit and wrap add each to one single?

Here is a screenshot from Twitter, I want to highlight such text:

Answer 1

textarea, contenteditable. , , div ( ) . onkey div , 140. , html .

, element.textContent html element.innerHTML.

, , , html, .

EDIT: , textarea input hidden, div .

, - jquery:

$('#form').submit(function(e) {
    var input = $('#inputdiv').text();
    if(input.length <= 140) {
        $('#formtextarea').val(input);
        return true;
    }
    return false;
});

ajax.

function sendStuff() {
    $.post("test.php", { message: $('#inputdiv').text()})
    .done(function(data) {
         // do something here
    });
}