从底部到顶部添加带有文本的Divs

Question

是否可能在从底部到顶部的大div容器中添加带有文本消息的div？我想开始从底部列出我的聊天消息。我需要在现有的下方添加带有旧消息的任何新div（在底部孔容器上）。

谢谢。

  <div id="public_message_container" style="overflow:auto;width:500px;height:300px;">
    <div class='public_message'><b>Nick1:</b> Message1</div>
    <div class='public_message'><b>Nick2:</b> Message2</div>
    <div class='public_message'><b>Nick3:</b> Message3</div>
    <div class='public_message'><b>Nick4:</b> Message4</div>
</div>

当我添加动态消息1-4时，我希望它从下到顶显示。

Answer 1

您需要选择容器的最后一个孩子，然后使用.after()

插入

$("#public_message_container div").last().after("<div class='public_message'><b>Nick5:</b> Message5</div>")