Add class on div using foreach if else Laravel - php

Question

I have 5 items ( 3 items on first row & 2 items on 2nd row ) that loads something like this
Here's my sample blade code
<div class="row">
#if( !empty( $data ) )
#foreach( $data as $field )
<div class="col-lg-4 services-overview-section__item">
<div class="services-overview-section__item--image">
<a href="{!! url('services-detail/'.$field->slug) !!}">
<img src="{{url($field->banner_image) }}">
<div class="services-overview-section__item--overlay">
<h3>{!! $field->name !!}</h3>
</div>
</a>
</div>
<div class="services-overview-section__item--content">
{!! $field->overview_description !!}
</div>
</div>
#endforeach
#endif
</div>
But what I'm trying to do is something like this
By doing this I need to add a class named as 'mid' on this location
<div class="col-lg-4 services-overview-section__item mid">
Tried to use something like this
<div class="col-lg-4 services-overview-section__item {{ $loop->iteration % 2 == 0 ? 'mid' : '' }}">
But it doesn't give me the right output like what I expected.
I just want to add class 'mid' for every 2nd item of the rows

Answer 1

A simple solution :
<div class="row">
#if( !empty( $data ) )
#php $itemThatNeedClass = 1; #endphp
#foreach( $data as $field )
#php
$customClass = "";
if ($loop->index === $itemThatNeedClass) {
$customClass = "mid";
$itemThatNeedClass += 3;
}
#endphp
<div class="col-lg-4 services-overview-section__item {{ $customClass }}">
<div class="services-overview-section__item--image">
<a href="{!! url('services-detail/'.$field->slug) !!}">
<img src="{{url($field->banner_image) }}">
<div class="services-overview-section__item--overlay">
<h3>{!! $field->name !!}</h3>
</div>
</a>
</div>
<div class="services-overview-section__item--content">
{!! $field->overview_description !!}
</div>
</div>
#endforeach
#endif
</div>