Cuando queremos asignar un evento de jQuery a un elemento que hemos generado dinámicamente, como por ejemplo la respuesta HTML de una petición que hemos realizado mediante Ajax, no nos sirve el método tradicional, ya que si probamos el siguiente código con un elemento generado dinámicamente podemos comprobar que no hace nada.

/* Este ejemplo no funciona al hacer click sobre el enlace 
que generamos dinámicamente. */

$(document).ready(function(){
	
	$("a#boton").on("click",function(event){
		event.preventDefault();
		
		alert("Probando asignación");
		
	});

	// Generamos el enlace dinámicamente
	$("body").html("<a href='#' id='boton'>Botón</a>");

});

Para poder crear el evento al elemento generado, debemos hacerlo de la siguiente manera:

// Esto si funciona para un elemento generado dinámicamente.

$(document).ready(function(){
	
	$("body").on("click","a#boton",function(event){
		event.preventDefault();
		
		alert("Probando asignación");
		
	});

	// Generamos el enlace dinámicamente
	$("body").html("<a href='#' id='boton'>Botón</a>");

});

Como véis ponemos al «body» como el selector principal y después de asignarle el evento «click«, le indicamos el selector del elemento al que le queremos asignar este evento.