Esta pregunta ya tiene una respuesta aquí:

Supongamos que tengo algún código jQuery que adjunta un controlador de eventos a todos los elementos con la clase "myclass". Por ejemplo:

$(function(){
    $(".myclass").click( function() {
        // do something
    });
});

Y mi html podría ser el siguiente:

<a class="myclass" href="#">test1</a>
<a class="myclass" href="#">test2</a>
<a class="myclass" href="#">test3</a>

Eso funciona sin problema. Sin embargo, considere si los elementos de "myclass" se escribieron en la página en algún momento futuro.

Por ejemplo:

<a id="anchor1" href="#">create link dynamically</a>
<script type="text/javascript">
$(function(){
    $("#anchor1").click( function() {
        $("#anchor1").append('<a class="myclass" href="#">test4</a>');
    });
});
</script>

En este caso, el enlace "test4" se crea cuando un usuario hace clic en un # anchor1.

El enlace "test4" no tiene asociado el controlador click (), aunque tenga class = "myclass".

¿Alguna idea de cómo puedo arreglar esto?

Básicamente, me gustaría escribir el controlador de clic () una vez y hacer que se aplique tanto al contenido presente en la carga de la página como al contenido que se incorporará más tarde a través de Ajax / DHTML.