使用jquery动态添加div

Question

我有这个小的 todo 应用程序，其中我有三个 div，即生产、开发和测试，在其中我有 p id="subtask" 的子任务。

现在我在每个任务中都有一个添加链接，它将在相应的任务 div 中添加新的子任务。所以当我点击添加时，应该在之前的子任务下方创建一个新的 p id="subtask"。

我添加了由子任务组成的任务 div 的图像，我需要创建新的子任务 低于之前的。

http://i.stack.imgur.com/ACIiY.png

 <div class="user span9 default-skin">
<ul>
    <% if @project.tasks.any? %>
        <% @project.tasks.each do |task| %>

        <div class="span5" id="tasks">

            <p><b><%=task.taskname %></b>
            <%=link_to 'edit name',edit_task_path(task) %></p>

            <% task.subtasks.each do |subtask| %>


                <p id="subtask" data-toggle="modal" data-target="#myModal"><%=subtask.name %></p>
                <%end%>

                <%=render 'layouts/modal' %>

                <p id="addcard"><a href="#">Add a card...</a></p>
        </div>

    <%end%>
<%end%>


</ul>


</div>

这是我尝试过的 jquery

$("#addcard > a").click(function(){
    $("#subtask").append("<p id='subtask'></p>");
  });

Answer 1

因为我没有代码

所以将向您解释这将是一个示例

 Your html


  <div id='production'></div>
  <input type='button' value='Add' id='add_production'/>

your jquery
 $(document).ready(function(){
 $('#add_production').click(function(){
 $('#production').append('<p>Sub Task</p>');
   });
  });