jquery: toggling the child of a div

Question

I want to toggle all the content in a <div> :

<div class="direccion">
    Dirección
    <div class="frm-section hide">            
        <label class="field prepend-icon">
            <input type="email" name="email" id="email" class="uit-input" placeholder="Dirección">
            <b class="uit-tooltip tip-left"><em>Dirección del paciente</em></b>
            <span class="field-icon"><i class="fa fa-envelope"></i></span>                      
        </label>
    </div><!-- end section -->

    <div class="frm-section hide">            
        <label class="field prepend-icon">
            <input type="email" name="email" id="email" class="uit-input" placeholder="No. Exterior">
            <b class="uit-tooltip tip-left"><em>Número exterior</em></b>
            <span class="field-icon"><i class="fa fa-envelope"></i></span>                      
        </label>
    </div><!-- end section -->
</div><!-- end direccion -->

I've tried multiple jQuery's on the forum, but none of the worked for me

Answer 1

Do you mean hide/show your .direccion content on a click of a button? If so you can do it by using jQuery Toggle

$( "#clickme" ).click(function() {
    $( ".direccion" ).toggle('fast');
});

Online example here