I have a foreach that is spitting out these blocks of listings. Since I'm using Bootstrap, every 4th one needs to end and start a row (<div class="row">).

How could I modify this code to do that? I can't figure it out for the life of me!

	<div class="row">
	@foreach ($featuredlistings as $fl)
		<div class="col-md-3 col-sm-6">
			<div class="well featured-property">
				<a href="#"><img src="{{ $fl->firstPhotoPath }}" class="img-responsive" alt=""></a>
				<p class="title">{{ $fl->communityName }}<br/>{{ $fl->CleanStreet }}<br />{{ $fl->CleanCityStateZip }}</p>
				<div class="data-row">
					<span class="attribute">Bedrooms</span>
					<span class="value">{{ $fl->Bedrooms }}</span>
				</div>
				<div class="data-row">
					<span class="attribute">Bathrooms</span>
					<span class="value">{{ $fl->Bathrooms }}</span>
				</div>
				<div class="data-row">
					<span class="attribute">Square Feet</span>
					<span class="value">{{ number_format($fl->ApproxLivingArea) }}</span>
				</div>
				<div class="data-row">
					<span class="attribute">Year Built</span>
					<span class="value">{{ $fl->YearBuilt }}</span>
				</div>
				<p class="price"><a href="#">${{ number_format($fl->CurrentPrice,0) }}</a></p>
			</div> <!-- End well featured-property div -->
		</div> <!-- end col-md-3 div -->		
	@endforeach
	</div> <!-- End row -->