<script src="jquery/jquery-3.2.1.js"></script>

<script>

   $("#gallerytrigger_1").on('click',function(){
   $("#gallery_1").toggle();
   $("#gallery_2").hide();
   $("#gallery_3").hide();
   $("#gallery_4").hide();
});

$("#gallerytrigger_2").on('click',function(){
   $("#gallery_4").hide();
   $("#gallery_3").hide();
   $("#gallery_2").toggle();
   $("#gallery_1").hide();
});

$("#gallerytrigger_3").on('click',function(){
   $("#gallery_4").hide();
   $("#gallery_3").toggle();
   $("#gallery_2").hide();
   $("#gallery_1").hide();
});

$("#gallerytrigger_4").on('click',function(){
   $("#gallery_4").toggle();
   $("#gallery_3").hide();
   $("#gallery_2").hide();
   $("#gallery_1").hide();
});
</script

@foreach($gallerys as $gallery)
<div class="col-sm-2">
 <br>
  <div id="gallery_{{$loop->iteration}}" style="display:none;">
   <p style="text-align: center;"><img style="width: 100%;border-radius:
     6px;" src="/gallery/{{ $gallery->imagelocation }}"></p>
  </div>
 </div>
@endforeach

@foreach($gallerys as $gallery)
<div class="col-xs-2">
 <br>
  <div id="gallerytrigger_{{$loop->iteration}}">
   <hr>
   <img style="width: 200%;border-radius: 6px;margin-left: -12px;margin-
    top: -100px;" src="/gallery/{{ $gallery->imagelocation }}">
  </div>
</div>
@endforeach

<script src="jquery/jquery-3.2.1.js"></script>

<script>
  $(".galleryTrigger").click(function(){
      var id = $(this).data('id');
      $(".gallery").hide();
      $("#gallery_"+id).show();
  });
</script>

@foreach($gallerys as $gallery)
<div class="col-sm-2">
 <br>
  <div id="gallery_{{$loop->iteration}}" style="display:none;" class="gallery" data-id="{{$loop->iteration}}">
   <p style="text-align: center;"><img style="width: 100%;border-radius:
     6px;" src="/gallery/{{ $gallery->imagelocation }}"></p>
  </div>
 </div>
@endforeach

@foreach($gallerys as $gallery)
<div class="col-xs-2">
 <br>
  <div id="gallerytrigger_{{$loop->iteration}}" data-id="{{$loop->iteration}}" class="galleryTrigger">
   <hr>
   <img style="width: 200%;border-radius: 6px;margin-left: -12px;margin-
    top: -100px;" src="/gallery/{{ $gallery->imagelocation }}">
  </div>
</div>
@endforeach