Elemento restituito da ajax non riconosciuto

[magic_key]

Ciao a tutti, come da titolo non riesco a portare "sullo stesso livello" gli elementi restituiti dall'ajax nella pagina che la richiama:

$.ajax({
    type: "POST",
    url: "test.php",
    dataType: "html",
    success: function(msg){
        $("#result").html(msg);
    }
});

<div id="result"></div>

La pagina richiesta restituisce un pulsante con un valore

echo '<button id="btn2" value="1">Click</button>';

Se clicco sul pulsante restituito il valore non viene catturato

$("#btn2").click(function(){
    console.log($(this.val()));
});

Come posso risolvere? Grazie

[cavicchiandrea]

L'evento click sul btn2 quando lo generi? E comunque innitando html tanto vale scriverlo direttamente nel tasto <button id="btn2" value="1" onClick="TuaFunzione()">Click</button>

[KillerWorm]

console.log($(this.val()));

Ciao, questa forma è sbagliata, stai mischiando l'uso delle due diverse forme di sintassi tra i due contesti di utilizzo, "puro JavaScript" e "jQuery".

Per prelevare il valore da un elemento DOM HTML:

- in "puro JavaScript" si usa la forma this.value, perché value è una proprietà di quegli specifici elementi DOM HTML e generalmente fa riferimento all'omonimo attributo value del relativo tag HTML. In questo caso puoi usare: console.log(this.value);

- in jQuery puoi usare il metodo val(), proprio dell'oggetto jQuery che incapsula l'elemento stesso (o la selezione di elementi) del DOM. In questo caso puoi usare: console.log($(this).val());

Considera comunque che jQuery è una libreria basata su JavaScript per cui, in termini di velocità di esecuzione dello script, generalmente è più performante usare il puro JavaScript.

In sostanza, per prelevare il valore dell'attributo value di quel tag, in JavaScript ti riferisci direttamente alla proprietà value che il relativo l'elemento DOM possiede; mentre in jQuery il passaggio è molto più elaborato (anche se eseguito in modo silente), va passato l'elemento DOM alla funzione principale $() che costruisce e restituisce un oggetto jQuery contenente svariati metodi è proprietà, quindi puoi usare il metodo val() che sostanzialmente andrà a pescare proprio quella stessa proprietà value di tale elemento DOM.

Consiglio quindi di usare jQuery giusto nelle situazioni in cui ti serve snellire dei passaggi che in JavaScript potrebbero risultare relativamente elaborati in termini di stesura del codice, ad esempio impostare la tua chiamata AJAX, ma in altri casi è preferibile adoperare il semplice JavaScript, come nel caso di this.value.

Potresti usare anche la forma proposta da cavicchiandrea.