Al añadir varios elementos HTML con jQuery

Question

soy nuevo en jQuery y preguntándose si alguno me puede asesorar sobre las mejores prácticas ...

Busco para añadir un elemento div de la página, que contiene una gran cantidad de HTML y no seguro cuál es la mejor manera de lograr esto .... o si es recomendable usar jquery ...

Por ejemplo, si quería agregar el siguiente código a la página usando jquery, ¿cuál es la mejor manera.

<div id="test"> 
    <h1>This is the test</h1> 
    <p>Hello, just a test</p> 
    <a href="www.test.com">Click me</a> 
    <a href="www.test.com">Click me again</a> 
</div> 

Answer 1

$("#test").append("YOUR CONTENT GOES HERE"); 

Answer 2

$("#id_of_div").append($("#id_of_div_that_you_wanna_append").html()); 

Answer 3

Si desea agregar el código HTML tal como es, a continuación, sólo tiene que utilizar la función de jQuery anexar. Por ejemplo:

$('body').append(' 
<div id="test">\ 
    <h1>This is the test</h1>\ 
     <p>Hello, just a test</p>\ 
     <a href="www.test.com">Click me</a>\ 
     <a href="www.test.com">Click me again</a>\ 
</div>'); 

Cambiar el selector de cuerpo a otro elemento/selector de DOM acuerdo a sus necesidades.

O si ya tiene el elemento div con ID "prueba" en el documento, entonces se puede establecer el contenido utilizando la función html(), como a continuación:

$("#test").html('<h1>This is the test</h1>\ 
     <p>Hello, just a test</p>\ 
     <a href="www.test.com">Click me</a>\ 
     <a href="www.test.com">Click me again</a>');