Javascript 将鼠标悬停在生成的动态链接上

我想创建一个类似于jQuery中的示例的悬停。但是链接是动态生成的，所以我真的很难弄明白这一点

我试过这个：

$(document).ready( function() {
    $('a.g-tabs').on('hover', 'a', function() {
            $( this ).append( $('<i class="icon-clear-remove" onClick="tabRemove();"></i>') );
        },
        function() {
            $( this ).find( ".icon-clear-remove:last" ).remove();
    });
});

---

如果是动态创建的，则必须使用委托

         $(document).on('mouseenter', 'a.g-tabs', function() {
                    $( this ).append( $('<i class="icon-clear-remove" onClick="tabRemove();"></i>') );
        });
    $(document).on('mouseleave', 'a.g-tabs', function() {
      $( this ).find( ".icon-clear-remove:last" ).remove();
 });

$（document）.on（'mouseenter'，'a.g-tabs'，function（））{
添加（$（''）；
});
$（文档）.on（'mouseleave'，'a.g-tabs'，function（））{
$（this.find（“.icon clear remove:last”）.remove（）；
});

使用CSS

.g-tabs a>.icon-clear-remove
{
 display:none;
}
.g-tabs a:hover>.icon-clear-remove
{
 display:inline-block;
}

E>F匹配作为元素E的子元素的任何F元素。 E：在用户悬停E期间，悬停匹配E

所以，E:hover>F意味着当用户悬停E时，将规则应用于F

请在此处尝试

尝试此代码

 $('a.g-tabs').on({
    mouseenter:  function() {
        $( this ).append( $('<i class="icon-clear-remove" onClick="tabRemove();"></i>') );
    },
    mouseleave: function() {
        $( this ).find( ".icon-clear-remove:last" ).remove();
    }
}, "a"); 

$（'a.g-tabs'）。在({
mouseenter:function（）{
添加（$（''）；
},
mouseleave:function（）{
$（this.find（“.icon clear remove:last”）.remove（）；
}
}，“a”）；

---

这段代码来自

你能发布你的html吗？你能做一个jsFidle的例子吗？@DhavalMarthak它没有问题，因为

append

可以获取

jquery对象的参数

参见我更新的question@newbie看，我想你用的不对我不明白怎么用这个。对不起，我对网络开发还不熟悉。包括CSS。这就是为什么我使用bootstrappaste将它添加到样式表css文件中，而不是附加和删除标记，只需使用服务器应用程序生成它，并附加到每个链接中。它将隐藏在文档就绪状态下，并且即使在DOM更改后也将显示在悬停状态。我无法使它工作，因为我的CSS中有此项

。图标清除删除{背景图像：url（../img/clear.png）；背景位置：居中；}

它不应该干扰，应该可以工作。如果没有-设定装备。如果我将我的

替换为
，图标似乎不起作用。图标清除删除
到
。图标清除删除：在
之前。我不知道为什么.png图像没有显示出来。它应该工作得很好，将上述代码保持在$（文档）之外。在（'submit'，'#pop form'）@新手尝试一下，我已经更新了答案，它对我有效。Hover实际上是mouseenter和mouse leave的组合，但不能将Hover用作委托事件，因此必须将两者分开使用。remove（）？您只需粘贴上面的代码而不是Hover，如果将mouseleave替换为this
$（document）。on（'mouseleave'，'a.g-tabs'，function（））{$（this）.find（“.icon clear remove:last”）.remove（）；}）；
，请在我接受之前更新您的答案。
         $(document).on('mouseenter', 'a.g-tabs', function() {
                    $( this ).append( $('<i class="icon-clear-remove" onClick="tabRemove();"></i>') );
        });
    $(document).on('mouseleave', 'a.g-tabs', function() {
      $( this ).find( ".icon-clear-remove:last" ).remove();
 });

.g-tabs a>.icon-clear-remove
{
 display:none;
}
.g-tabs a:hover>.icon-clear-remove
{
 display:inline-block;
}

 $('a.g-tabs').on({
    mouseenter:  function() {
        $( this ).append( $('<i class="icon-clear-remove" onClick="tabRemove();"></i>') );
    },
    mouseleave: function() {
        $( this ).find( ".icon-clear-remove:last" ).remove();
    }
}, "a");