Нужно добавить новый тег li
с помощью jQuery так чтобы была и дата и имя и текст который ввел пользователь! Вот код:
$(document).ready(function() {
$(document).on("click", "add-comment", function() {
var form = $("form[name='form']");
form.css("display", "block");
$("#add-comment").replaceWith('form');
});
$(document).on("click", "input[name = 'send']", function() {
var myName = $("input[name = 'myName']").val();
var comment = $("textarea[name='comment']").val();
var newDate = $('.date_comment').val();
var newComment = $("<li class='comment-item'>" + "<p class='text_comment'>" +
comment + "</p>" + "</li>").appendTo("#new");
});
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<ul id="new">
<li class="comment-item">
<span class="name_comment">Боб</span>
<span class="date_comment"> 17 июня 2017 год</span>
<p class="text_comment">Привет</p>
</li>
</ul>
<div class="container">
<form name="form" id="form" action="#" method="post" onsubmit="return
false">
<textarea id="textarea" name="comment" cols="30" rows="10"></textarea><br>
<input type="submit" name="send" value="Добавить комментарий" id="done">
</form>
<a href="#" onclick="return false" id="add-comment"></a>
</div>