JQuery: accedere la nodo HTML generato dal metodo append()

In questi giorni ho avuto la necessità di aggiungere del codice HTML ad una pagina esistente e di modificarne successivamente le proprietà di visualizzazione.

Per aggiungere del codice HTML in un punto particolare di una pagina si può usare il metodo append() di jQuery: in un primo momento ho pensato che il metodo append() restituisse un puntatore al nodo jQuery appena creato, con questa ipotesi in mente ho pesato che la linea

<br />
// fissa a 30 l'ampiezza del nodo con id content<br />
$('#content').append('&lt;div&gt; Appuntamento &lt;div&gt;').width('30px');<br />

fissasse l’ampiezza a 30 pixel l’ampiezza del nuovo nodo HTML creato da append().

In realtà le linee di codice fissano a 30 l’ampiezza del nodo padre (quello con id content) e non è quello che volevo ottenere: infatti append() restituisce il nodo padre, non il nodo appena creato.

Per ottenere quello che volevo ho dovuto modificare il codice sfruttando la possibilità di creare un nuovo nodo HTML dato dall’oggetto jQuery ($) e la possibilità di passare la metodo append() quel nodo (che viene quindi messo al posto gusto nella struttura della pagina)

<br />
azione=$('&lt;div&gt; Appuntamento &lt;div&gt;');<br />
$('#content').append(azione);<br />
azione.width('30px');<br />

Grazie all’ispirazione di questo post di Stack Overflow