jQuery（使用Django）：使用click事件将URL追加到列表中

当我从药物列表中向“患者药物”列表添加某些内容时，我希望能够使用“药物打开”的类单击事件将其删除。单击事件适用于从原始代码生成的药物，但单击时不会删除我添加的内容。我做错了什么？这条线有问题吗

$('#patient_medications').append('<li><a href="#" class="medication-on" data-cost='+cost+'>'+med_name+'</a></li>');

已添加链接，但单击不会导致事件

我也希望您能给我一些指导，告诉我如何使用大量的药物来完成类似的工作，比如，从搜索框中生成所有药物的URL，或者使用一个很酷的小部件根据用户输入选择一些药物

多谢各位

<ul id='patient_medications'>
{% for med in patient.medications.all %}
       <li><a href="#" class="medication-on" data-cost="{{med.m_cost}}">{{med.name}}</a></li>
{% endfor %}
</ul>
</div>
<h4>Total Cost (30-day supply):</h4>
<div id="costs">
{{sum.m_cost__sum}}
</div>
<h3>Available Medications:</h3>
{% for m in medications %}
    <li><a href="#" class="medication-link" data-cost="{{m.m_cost}}">{{m.name}}</a></li>
{% endfor %}
</div>
<script type="text/javascript">
$('.medication-on').click(function() {
    var link = $(this);
    var cost = link.data("cost");
    var costs = $('#costs');
    var cur_cost = parseFloat(costs.html());
    var result = cur_cost - cost;
    costs.html(result);
    $(this).parent().remove();
    $(this).remove();
});
$('.medication-link').click(function() {
    event.preventDefault();
    var link = $(this);
    var med_name = link.html();
    var cost = link.data("cost");
    $('#patient_medications').append('<li><a href="#" class="medication-on" data-cost='+cost+'>'+med_name+'</a></li>');
    var costs = $('#costs');
    var cur_cost = parseFloat(costs.html());
    var result = cur_cost + cost;
    costs.html(result);
});

</script>
{% endblock %}

---

您应该使用.on函数而不是.click，因为元素在html文档中是动态追加的。较旧的jQuery版本使用.live。这似乎也不起作用，除非我误解了？旧链接有效，但新链接无效。