Код вывода сообщений

<script>
chat = {
    loaded: false,      //Флаг уже загруженного чата
    timeout: 2000,      //Время в секундах между выводами сообщений
    
    names: ['Елена', 'Василий', 'Игнат', 'Милана', 'Анатолий', 'Никита', 'Александр', 'Евгений', 'Виктория', 'Михаил', 'Александр', 'Ольга', 'Валентина', 'Людмила', 'Азмур', 'Владимир', 'Никита', 'Юлия', 'Ленуська', 'Марат', 'Артём', 'Нийяз', 'Фаиль', 'Елизавета', 'Тигран', 'Валерия'],
    text: ['Заработал(а) только что 312 руб.',
            'Заработал(а) только что 271 руб.',
            'Заработал(а) только что 211 руб.',
            'Заработал(а) только что 283 руб.',
            'Заработал(а) только что 400 руб.',
            'Заработал(а) только что 152 руб.',
            'Заработал(а) только что 300 руб.',
            'Заработал(а) только что 478 руб.'],
    start: function() {
        if (!chat.loaded)
        {
            var container = $('.chat');
            var wrapper = $('<div class="chatwrap"></div>');
            wrapper.insertBefore(container);
            wrapper.append(container);
            
            
            $('.chat + .inputs input').on('keyup', function(e) {
                if (e.keyCode == 13 || e.keyCode == 10)
                    chat.userPost();
            });
            
            $('.chat + .inputs button').on('click', function() {chat.userPost();})
        }
        chat.loaded = true;
        chat.timer = setInterval(chat.post, chat.timeout);
    },
    post: function() {
        if (arguments.length < 2)
        {
            var userclass = '';
            var rnd = Math.round(Math.random() * chat.names.length-1);
            if (rnd > chat.names.length - 1 || rnd < 0)
                rnd = chat.names.length - 1; 
            var name = chat.names[rnd];
            rnd = Math.round(Math.random() * chat.text.length-1)
            if (rnd > (chat.text.length - 1) || rnd < 0)
                rnd = chat.text.length - 1; 
            var msg = chat.text[rnd];
        }
        else
        {
            var userclass = ' userpost';
            var name = arguments[0];
            var msg = arguments[1];
        }
        var newmsg = $('<div class="message'+userclass+'"><b>'+name+'</b>: '+msg+'</div>');
        $('.chat').append(newmsg);
        $('.chat')[0].scroll= $('.chat')[0].scrollTop= 9999;
    },
    userPost: function() {
        var name = $('.chat + .inputs input:first-child');
        var text = $('.chat + .inputs input:nth-child(2)');
        if (!name.val().length)
        {
            name.focus();
            return;
        }
        if (!text.val().length)
        {
            text.focus();
            return;
        }
        chat.post(name.val(), text.val());
        text.val('');
        text.focus();
    }
}
$(function() {
    chat.start();
    for (var t = 0; t < 6; t++)
        chat.post();
});
</script>

<style>
.chatwrap {width: 500px; margin: 0 auto;}
.chat {
    height: 300px;
    overflow: hidden;
    overflow-y: scroll;
    background-color: #FFF;
}
.chat + .inputs {overflow: hidden; margin-top: 10px;}
.chat + .inputs input {
    margin-right: 10px;
    border: 1px solid #FAC514;
    background-color: #FFF;
    color: #A3A3A3;
    height: 35px;
    border-radius: 5px;
    padding: 0 8px;
}
.chat + .inputs input:nth-child(2) {width: 250px;}
.chat + .inputs button {
    background-color: #FAC514;
    color: #FFF;
    border: none;
    height: 35px;
    border-radius: 5px;
    padding: 2px 15px;
    cursor: pointer;
}
.chat + .inputs .leftside {float: left;}
.chat + .inputs .rightside {float: right;}
.chat .message {
  background: rgba(0, 0, 0, 0) linear-gradient(to top, #ededed, #fefefe) repeat scroll 0 0;
  border-radius: 50px;
  box-shadow: 1px 1px 5px 0 rgba(150, 150, 150, 0.75);
  box-sizing: border-box;
  clear: both;
  display: inline-block;
  float: left;
  margin-bottom: 10px;
  margin-left: 22px;
  max-width: 80%;
  padding: 6px 20px;
  position: relative;
  word-wrap: break-word;
}
.chat .userpost b {color: #008300;}
</style>

<div class="chat"></div>