javascriptのクリックイベントが発生しない

Question

クリックイベントが発生していない理由を把握できません。ごみ箱のアイコンをクリックして、リスト要素を削除する関数を実行しようとしています。 clickイベントの後、スクリプト内の何かを実行するのに失敗します。それはconsole.logでもすぐ下のものではありません。以下はマークアップとスクリプトです。

HTMLコード

<div class="col-6"> 
    <div class="js-list-item"> 
     <h3 class="js-list-title"></h3> 
     <a href="" id="js-edit"><i class="fa fa-pencil" aria-hidden="true"></i></a> 
     <a href=""id="js-delete"><i class="fa fa-trash-o" aria-hidden="true"></i></a> 
     <p>Date: <span class="js-date"></span></p> 
     <p>Schedule: <span class="js-schedule"></span> at <span class="js-schedule-time"> 
     </span></p> 
    </div> 
</div> 

javascriptのコード

function handleDelete() { 
$('.js-list-item').on('click', 'fa-trash-o', function(e) { 
    console.log('test'); 
    e.preventDefault(); 
    deleteShow(
     $(e.currentTarget).closest('.js-list-item').attr('id') 
    ); 
}); 
} 

Answer 1

（ 'クリック'、 'FA-ゴミ-O'、機能（e）の

FA-ゴミ-oが適切なセレクタではない、クラスまたはIDを使用する

Answer 2

.on()関数の2番目のパラメータはセレクタです。

http://api.jquery.com/on/

変更：

$('.js-list-item').on('click', 'fa-trash-o', function(e) {

へ：

$('.js-list-item').on('click', '.fa-trash-o', function(e) {