Как добавить новый блок после существуещего?

Question

[IvankoPo]

Как должно работать - ввожу в поле текст нажимаю на кнопку создаётся выше блок с текстом якобы сообщние, ввожу еще что то снова после того блока добавляеться блок со вторым сообщением. Как работает ввожу текст первое сообщение на скрине здравствуй отправляю создаться блок вроде бы хорошо, пишу второе сообщение нажимаю добавить, а он не добавляется после существующего а заменяет его. Как исправить ? -------------------------------------------------------------------------- -------------------------------------------------------------------------------- --------------------------------------------------------------------------------------------------------------------------

Answer 1

[MrTimon]

var div = document.createElement('div');
div.className = 'cl';

Эти строчки нужно переместить в тело функции , что вызывается на клик. (в самом начале функции нужно поставить)

Comments

[IvankoPo]

точно спасибо

Answer 2

[Виктор]

а почему не сделать проще, в две строчки, или можно даже в одну:

newblok='<div clas="c1">'+form.text.value+'</div>';
$("#pole").html( newblok+ $("#pole").html()  );

И тут уж хотите "до" пишите, хотите "после" старых блоков, как душе угодно

Comments

[IvankoPo]

может и проще, но мне как новичку данный синтаксис чужд, это фреймворк какой то ?

[Виктор]

Никаких особых фреймворков, только JQ но при желании можно и без него, только чуть длиннее строчки будут.
Создаём переменную (строку) содержащую DIV нашего нового сообщения:

newblok='<div clas="c1">'+form.text.value+'</div>';

Берёт DIV c ID=pole и в начло его содержимого подписывает нашу строчку и пункта 1
$("#pole").html( newblok+ $("#pole").html() );

Вот таже вторая строчка без JQ

document.getElementById('pole').innerHTML= newblok+ document.getElementById('pole').innerHTML;