jquery non funziona sempre

[DUMAX]

Salve,
ho poca esperienza con java / jquery quindi spero possiate aiutarmi a risolvere un piccolo problema.

Ho una pagina che tramite jquery aggiunge elementi al click di un altro elemento utilizzando .prepend();
Fin qui non ci sono problemi.

all'elemento:

<label>Motivo del Reso / Guasto *  <span id="charNum1">(200 Caratteri disponibili)</span></label>
<textarea class="difetto" id="difetto1" name="difetto1" cols="50" rows="2" maxlength="200" required="required" aria-required="true" placeholder=""></textarea>

Poi ho aggiunto questa funzione nello script:

jQuery('#difetto1').keyup(function () {

  var max = 200;

  var len = jQuery(this).val().length;

  if (len >= max) {

    jQuery('#charNum1').text(' (Limite massimo caratteri raggiunto)');

  } else {

    var char = max - len;

    jQuery('#charNum1').text('(' + char + ' Caratteri disponibili)');

  }

});

Questo mi permette di contare i caratteri digitati all'interno dell'area di testo.
Nell'elemento textarea che ho scritto sopra, funziona.
Mentre per gli elementi che vengono aggiunti successivamente mediante .prepend() non funzionano.
Sembra come se i nuovi elementi non facciano parte della pagina.

Ecco il link alla pagina in questione se magari voleste ispezionare il codice:
http://www.progettoaries.it/index.php/invia-rma.html

Cosa ne pensate?

[KillerWorm]

Ciao, la risposta è "usa on() per delegare il gestore di evento".
Il modo con cui hai applicato il gestore di evento keyup, si riferisce agli elementi trovati in quel momento sulla pagina. E' normale quindi il comportamento che descrivi. Per applicare il gestore di eventi anche ad elementi futuri, hai bisogno di delegare l'assegnazione dell'evento.

[DUMAX]

Ciao KillerWorm,
ho provato come mi hai suggerito e funziona benissimo.
Grazie mille!!!