html标签丢失,如何动态替换HTML标签而不会丢失事件

我有一个html ul标签，我有这样的东西：

• /img>

• 

这是一个常见的列表，显示为滑块。正如你所看到的，每个图像都在div内，你可以点击并在另一个div中显示它。

好的，我有这个清单：

Selecciona la sección que te gustaría visualizar:

• Escaparates

  $('#escaparates_show').click(function()

  {

  console.log('clicked');

  $('#menu').html('');

  $('

• 
• 
• 
• 
• 
  ')

.prependTo('#menu');

$('#galeria_seleccionada').html('Escaparates');

});

Decoración

$('#decoracion_show').click(function()

{

console.log('clicked');

$('#menu').html('');

$('

')

.prependTo('#menu');

$('#galeria_seleccionada').html('Decoración');

});

这是一个列表，显示了最后一个列表中每个元素包含的可能图像。当我点击列表中的每个元素时，它将删除第一个“#menu”列表的html并将其替换为我希望的内容。这样，我可以显示不同的图像列表，可以在另一个div上点击和展开。

问题是，当我将新内容替换为新列表时，它完美地显示了新的图像列表，但它不会继承“clickable” b>事件，所以在我第一次替换HTML标记时，它失去了它的可点击。

任何人都可以知道为什么会发生这种情况？

谢谢！

编辑：

对于同样的问题，我有这个jquery事件：

$('#menu').on("hover", '#menu li',

function() {

//mouse over LI and look for A element for transition

$(this).find('img')

.animate( { opacity:1 }, 200)

});它适用于所有继承的元素，但我无法让“mouseleave”事件继承。如果我添加：

$('#menu').on("hover", '#menu li',

function() {

//mouse over LI and look for A element for transition

$(this).find('img')

.animate( { opacity:1 }, 200)

},

function() {

$(this).find('img')

.animate( { opacity:0.5 }, 200)

});它不起作用。它如何为悬停onleave事件？