Close other opened divs when current divs is opened (jQuery)

Question

I got a couple of elements that shows a div when clicked on it. The only problem is when you click them all, all divs are opened instead of just the one that was clicked.

My jquery:

<script>
$(document).ready(function() {
    $('.servicemark').click(function() {
        console.log($(this).attr('data-toggle'));
        var type =  $(this).attr('data-toggle');
        $('.'+type).slideToggle("slide");
    });
});
</script>

My html/php:

<section class="def-section home-services">
    <div class="container">
        <div class="row">
    <?php
    foreach($blocks as $block) {
      $images = json_decode($block->images);
      echo '
      <!-- === SERVICE ITEM === -->
            <div class="col-lg-3 col-md-3 col-sm-3 col-xs-12 servicemark" data-toggle="'.$block->alias.'" style="cursor:pointer;">
        <div class="service-mark-border-top"></div>
        <div class="service-mark-border-right"></div>
        <div class="service-mark-border-bottom"></div>
        <div class="service-mark-border-left"></div>
                <div class="service">
                    <div class="service-icon">
                        <img src="cms/'.$images->image_intro.'" />
                    </div>
                    <h3>'.$block->title.'</h3>
                    <div class="service-text">
                        <p>'.$block->introtext.'</p>
                    </div>
                </div>
        </div>
  ';
}
?>

 <div class="row zee-container-vervoer" style="display:none;">
    <div class="text">
        <p>Zee container vervoer Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc est neque, egestas et aliquam vitae, elementum eget neque. Donec fringilla purus nec viverra viverra. Nullam volutpat purus id risus sodales, id sodales sapien molestie. Phasellus bibendum massa et tellus aliquet rhoncus. Suspendisse accumsan, velit sed lacinia iaculis, sem neque condimentum magna, sed volutpat quam metus sed massa. Curabitur lobortis ligula sed consectetur consequat. Praesent suscipit, metus ac efficitur molestie, erat ante laoreet dolor, ut molestie felis est non est. Fusce dictum pulvinar nulla. Maecenas tincidunt vehicula enim, a porttitor magna mattis vel. In id erat in urna ornare porttitor. Aenean a hendrerit elit.</p>
    </div>
 </div>
 <div class="row gevoelige-lading" style="display:none;">
    <div class="text">
        <p>Speciale lading Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc est neque, egestas et aliquam vitae, elementum eget neque. Donec fringilla purus nec viverra viverra. Nullam volutpat purus id risus sodales, id sodales sapien molestie. Phasellus bibendum massa et tellus aliquet rhoncus. Suspendisse accumsan, velit sed lacinia iaculis, sem neque condimentum magna, sed volutpat quam metus sed massa. Curabitur lobortis ligula sed consectetur consequat. Praesent suscipit, metus ac efficitur molestie, erat ante laoreet dolor, ut molestie felis est non est. Fusce dictum pulvinar nulla. Maecenas tincidunt vehicula enim, a porttitor magna mattis vel. In id erat in urna ornare porttitor. Aenean a hendrerit elit.</p>
    </div>
 </div>
 <div class="row temperatuur-gevoelige-lading" style="display:none;">
    <div class="text">
        <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc est neque, egestas et aliquam vitae, elementum eget neque. Donec fringilla purus nec viverra viverra. Nullam volutpat purus id risus sodales, id sodales sapien molestie. Phasellus bibendum massa et tellus aliquet rhoncus. Suspendisse accumsan, velit sed lacinia iaculis, sem neque condimentum magna, sed volutpat quam metus sed massa. Curabitur lobortis ligula sed consectetur consequat. Praesent suscipit, metus ac efficitur molestie, erat ante laoreet dolor, ut molestie felis est non est. Fusce dictum pulvinar nulla. Maecenas tincidunt vehicula enim, a porttitor magna mattis vel. In id erat in urna ornare porttitor. Aenean a hendrerit elit.</p>
    </div>
 </div>
 <div class="row explosieve-lading" style="display:none;">
    <div class="text">
        <p>Gevaarlijke stoffen Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc est neque, egestas et aliquam vitae, elementum eget neque. Donec fringilla purus nec viverra viverra. Nullam volutpat purus id risus sodales, id sodales sapien molestie. Phasellus bibendum massa et tellus aliquet rhoncus. Suspendisse accumsan, velit sed lacinia iaculis, sem neque condimentum magna, sed volutpat quam metus sed massa. Curabitur lobortis ligula sed consectetur consequat. Praesent suscipit, metus ac efficitur molestie, erat ante laoreet dolor, ut molestie felis est non est. Fusce dictum pulvinar nulla. Maecenas tincidunt vehicula enim, a porttitor magna mattis vel. In id erat in urna ornare porttitor. Aenean a hendrerit elit.</p>
    </div>
 </div>
</div>
</section>

Everything is now filtered by the alias of the correct element (class name is the same as the alias). How can I close all other elements except for the one that is currently opened?

Answer 1

Try this (based and thanks to Juan C. comment):

$('.' + type).slideToggle("slide").siblings(".row").hide();

Answer 2

Try this :

$(document).ready(function() {

    $('.servicemark').click(function() {

        console.log($(this).attr('data-toggle'));


        $(".servicemark").slideUp();

        $(this).slideDown();

    })

})