jQuery 'on' no se registra en el menú emergente modal generado dinámicamente

Tenía la impresión de que jQueryon el controlador de eventos estaba destinado a poder "escuchar" los elementos creados dinámicamente Y que se suponía que debía reemplazar el comportamiento delive. Sin embargo, lo que he experimentado es que usandoon no está capturando el evento click mientras que usalive está teniendo éxito!

El aspecto delicado de mi situación es que no solo estoy creando contenido dinámicamente sino que lo estoy haciendo a través de un AJAX.get() llamar, e insertar el HTML resultante en un modal.dialog() jQueryUI emergente

Aquí hay una versión simplificada de lo que estaba tratando de lograr (incluida en$(document).ready(...) ):

$.get("getUserDataAjax.php", queryString, function(formToDisplay) {
    $("#dialog").dialog({
        autoOpen: true,
        modal: true,
        buttons...
    }).html(formToDisplay);
});
$(".classThatExistsInFormToDisplay").on("click", function() {
    alert("This doesn't get called");
});

De la documentación paraon Encontré esto, que era como me acercaba a escribir mion evento:

$("p").on("click", function(){
    alert( $(this).text() );
});

Sin embargo, por alguna razón,live funcionará como espero - mientras queon me esta fallando

Esto no es una pregunta para "¿Cómo puedo hacer que funcione?" porque he encontrado queon Tendrá éxito (captura clics) si lo declarodentro lafunction(formToDisplay) llamar de vuelta.

Mi pregunta es: lo que está mal conon ¿Que no está encontrando mis elementos creados dinámicamente dentro de una ventana emergente modal? Mi instancia de jQuery es jquery-1.7.2. jQueryUI es 1.8.21.

Aquí hay dos jsFiddles que se aproximan al problema. Haga clic en la palabra "Prueba" en ambos casos para ver el comportamiento diferente. La única diferencia en el código es reemplazaron paralive.

Dóndeel clic es capturado porlive.

Dóndeel clic NO es capturado poron (haga clic en 'Prueba - haga clic en mí' para ver que no pase nada).

Me doy cuenta de que puedo estar usandoon inapropiadamente o pidiéndole que haga algo que no fue pensado pero quiero saberpor qué no funciona (pero si tiene algo terriblemente inteligente, no dude en compartirlo). Gracias por tu sabiduría!

Actualización / Respuesta / Solución:

Según el usuario 'indefinido', la diferencia es queon no está delegado desde la parte superior de ladocument objeto mientraslive hace / es.

Como menciona Claudio, hay porciones de laon Documentación que hace referencia a elementos creados dinámicamente.y eso lo que incluyes en el$("") parte de la consultanecesita existir en tiempo de ejecución.

Aquí está mi nueva solución: capturar eventos de clicon mi diálogo modal, que, aunque no tiene ningún contenido cuando el evento se crea en tiempo de ejecución, podrá encontrar mi contenido y elemento con una clase especial que se genera más adelante.

$("#dialog").on("click", ".classThatExistsInFormToDisplay", function() {
    ... //(success! Event captured)
});

¡Muchas gracias!

Respuestas a la pregunta(2)

Su respuesta a la pregunta