<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<div class="list-post"></div>
<script>
let listMessage =
[{user: "name1", last: "welcome1"},
{user: "name2", last: "welcome2"},
{user: "name3", last: "welcome3"},
{user: "name4", last: "welcome4"}];
listMessage.forEach(el=>{
document.querySelector(".list-post").insertAdjacentHTML('beforeend', `<div class="post">
<div class="author"><a href="#">${el.user}</a></div>
<div id = 'message' class="link">${el.last}<a href="#">hello</a></div>
<div class="info">info <a href="#">click</a></div>
</div>`);
});
</script>
</body>
</html>