Duplicate content and switch None display to block

Question

The goal is that when press on Units, the display:none; of id mostrar-previa for display:block and hidden content is displayed.

$(document).ready(function() {
    var previaUnidade = $("#step1").find("#mostrar-previa")[0].outerHTML;
    $(document).on("click", "#previa-unidades", function(e) {
        $("#step1")
            .find("#mostrar-previa")
            .append(previaUnidade);
    });
});

#mostrar-previa{
    display: none;
}

#previa-unidades{
    cursor: pointer;
}

#previa-unidades:hover{
    color: rgb(66, 139, 202);
}

<script src="https://code.jquery.com/jquery-3.3.1.js"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.2/js/bootstrap.bundle.min.js"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.2/js/bootstrap.min.js"></script>
<link href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.2/css/bootstrap.min.css" rel="stylesheet"/>

<form class="formulario" role="form">
    <div class="tab-content">
        <div class="tab-pane active" role="tabpanel" id="step1">
            <div class="row">
                <div class="col-md-12">
                    <div class="form-group">
                        <h3 id="previa-unidades">Adicionar Unidades
                            <i class="fas fa-plus-square"></i>
                        </h3>
                    </div>
                </div>
            </div>

            <div id="mostrar-previa">
                <div class="row">
                    <div class="col-md-12">
                        <div class="form-group">
                            <i class="fas fa-angle-double-right"></i>
                            <label>MOSTRAR UNIDADE AQUI</label>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</form>

Answer 1

I don’t quite understand but I think this code helps as a starting point. I hope to help.

<script>
$(document).ready(function() {
    $('#previa-unidades').click(function(){
        $('#mostrar-previa').show();
    });

});