jquery - 关于 Jquery 的问题

Question

我有这个代码html：

<ul>
    <li><label for="profit_0"></label><input type="text" id="profit_0" class="w-75"></li>
</ul>
<p>
  <a href=""><i class="fas fa-plus-circle text-center w-100 fa-2x"></i>
  </a>
</p>

在 jquery 中：

$( document ).ready(function(){
    $('.fa-plus-circle').on('click', function (){
       let nbProfits = $('ul li').length;
       $('ul').append('<li class="list-group-item"><label for="profit_'+nbProfits+'"></label><input type="text" class="w-75" id="profit_'+nbProfits+'"><a href="#"><i class="fas fa-trash w-25 text-center"></i></a></li>\n');
   });

   $('ul').on('click', '.fa-trash',  function (){
      $(this).parent().parent().remove();
   }); 
});

你能告诉我为什么当我把 li 改成 ul in

$('ul').on('click', '.fa-trash', function (){ 

点击不再有效？但是，包含 .fa-trash 的 i 标记位于 li 中。

标签： jquery