Javascript 对php的Ajax请求在每次页面加载时只起作用一次

我在这里看到了一些问题，但没有一个对我有用。我有一个喜欢的按钮，我希望我的用户按下，以喜爱的东西。ajax请求工作正常，收藏夹存储在数据库中，但我只能使用它一次，然后我必须刷新页面以查看/取消查看该项目。按钮的代码为：

<div id="fav-icon">
    <?php
    // Function checks if user has fav'd the item.
    $isFav = favourite($user->id) ? 'un-fav' : 'fav'; 
    ?>
    <i id="<?php echo $item->id; ?>" class="<?php echo $isFav; ?>"><span class="font-12 fa fa-heart"></span></i>
</div>

所以这只起作用一次！我尝试了几种不同的功能来实现这一点，包括：

$('.fav').live('click', function(e) {

有人能告诉我哪里出了问题，以及让我的按钮多次工作的正确方法吗

使用

$（文档）。在（）上单击事件

$(document).on('click','.fav', function(e) { 
...
});

使用
$（文档）。在（）上单击事件

$(document).on('click','.fav', function(e) { 
...
});

谢谢，那真是一种享受！还有一个问题，当点击心脏图标时，它似乎稍微向右移动……我会做一些研究并尝试解决它。谢谢你的帮助！！谢谢，那真是一种享受！还有一个问题，当点击心脏图标时，它似乎稍微向右移动……我会做一些研究并尝试解决它。谢谢你的帮助！！您是否在ajax文件中将状态从fav更改为UNAV/UNAV到fav？否，我只是使用php函数刷新div，以检查item类是否应为fav/un-fav。您是否在ajax文件中将状态从fav更改为UNAV/UNAV到fav？否，我只是使用php函数刷新div，以检查item类是否应为fav喜欢/不喜欢。