JSFiddle - React, Tailwind, and code Playground

HTML

<div class="container">
    
	<div class="row">

		<div class="tile">
			<div class="text">01</div>
		</div>
	
		<div class="tile">
			<div class="text">02</div>
		</div>
	
		<div class="tile">
			<div class="text dolphin">03</div>
		</div>
		
		<div class="tile">
			<div class="text">04</div>
		</div>
		
		<div class="tile">
			<div class="text">05</div>
		</div>
		
		<div class="tile">
			<div class="text dolphin">06</div>
		</div>
		
		<div class="tile">
			<div class="text">07</div>
		</div>
		
		<div class="tile">
			<div class="text dolphin">08</div>
		</div>
		
		<div class="tile">
			<div class="text">09</div>
		</div>
		
		<div class="tile">
			<div class="text">10</div>
		</div>
		
		<div class="tile">
			<div class="text">11</div>
		</div>
		
		<div class="tile">
			<div class="text">12</div>
		</div>
				
    </div><!-- end .row -->

	<button type="button" class="hide-divs" >HIDE DIVS 3, 6 &amp; 8</button>
</div>

CSS

.row {
	display: flex;
	flex-wrap: wrap;
	width: 500px;
	padding: 0;
	margin: 0;
	}

.text {
    height: 50px;
	width: 100px;
	margin: 10px;
	padding-top: 15px;
    background:tomato;
	color:#fff;
    text-align:center;
    font-size: 2em;
}

.tile:nth-child(4n-7) .text {
    border: 2px solid #ccc;
    background-color: yellow;
    color: #000;
}

button { 
	padding: 10px;
	background-color: lightblue;
	position: relative;
	left: 200px;
}

.hidden { display: none; }

JavaScript

var divs;

$('.tile').each(function(i){
	$(this).data('initial-index', i);
});

$('.hide-divs').on('click', function () {
	if(divs) {
    	$(divs).appendTo('.row').each(function(){
            var oldIndex = $(this).data('initial-index');
            $('.tile').eq(oldIndex).before(this);
        });
        divs = null;
    } else {
        divs = $('.dolphin').parent().detach();
    }
});