JSFiddle - React, Tailwind, and code Playground

by Bruno Nascimento

HTML

<div id="conteudo">
    <p> meu conteudo </p>
</div>

<div id="vazia1">
    <p> vazia 1 </p>
</div>

<div id="vazia2">
    <p> vazia 2 </p>
</div>

<hr>
    <h1> <b> Saida esperada </b></h1>
    
    <div id="conteudo2">
    <p> meu conteudo </p>
        <p> mudou </p>
</div>

<div id="vazia3">
    <p> vazia 1 </p>
    <p> meu conteudo </p>
</div>

<div id="vazia4">
    <p> vazia 2 </p>
     <p> meu conteudo </p>
</div>

CSS

div {
    border: 1px solid #333;
    border-style: dashed;
    border-color: #f0ad4e;
       
}

JavaScript

var copia = $('div#conteudo').children();
$('div#conteudo p ').append("<p> mudou </p>");

$('div#vazia1').append(copia.clone(true));

$('div#vazia2').append(copia.clone(true));