动态添加新的div/html与JSP？

我目前有一个网页，有几行标记为“东西”的对象。到目前为止，我已经将它们硬编码为html，如图所示：“风扇速度，温度，光照等”：http://i.imgur.com/ocRUlaD.png 动态添加新的div/html与JSP？

我期望通过将它们存储在数据库中来使这些条目动态化目前使用postgres），并直接从数据库中填充此框。通过这种方式，用户可以添加或删除“事物”并不断更新，类似于购物车。

现在，为了这个工作，我有点困惑，要做什么才能让我可以动态地为每个条目添加HTML。最终，每一行条目都应该有自己的表单，因此每行的HTML代码将非常相似，但每个表单都需要有唯一的链接。

我目前已经能够以JSON格式检索数据库中的所有条目。添加这些动态div/html块为每个“东西”创建新行的最佳方法是什么？

这里是一些示例html代码，我有专门负责“Light 1”的div。其他行将非常相似，但具有适当的表单操作和id。

<div class="large-event" id="space-font"> 
       <!-- Collapsable Button --> 
       <a data-toggle="collapse" data-target="#light1" href="#"> 
       Light 1 
       <img src="onBulb.png" id="bulbPic1" width="25" height="40" alt=""> 
       </a> 

       <!-- LIGHT 1 Collapse Material --> 
       <div id="light1" class="collapse out"> 
       <div class="shift-right"> 
        <form method="post" style="display:inline" action="/testlamp"> 
        <input type="hidden" name="node_address" value="1"> 
        <input type="radio" id="lampOn1" name="data_value" value="on" checked> On 
        <input type="radio" id="lampOff1" name="data_value" value="off"> Off 
        <input type="button" id="lampButton1" inline class="btn" onclick="lampStatusChange(this.id)" value="Submit"> 
        </form> 
       </div> 
       </div> 
</div>

来源

2013-06-04 Ray J Tong