<ul class="tabs">
<li class="tab col s3"><a class="btn-25 active" href="#">25%</a></li>
<li class="tab col s3"><a class="btn-33" href="#">33%</a></li>
<li class="tab col s3"><a class="btn-50" href="#">50%</a></li>
<li class="tab col s3"><a class="btn-100" href="#">100%</a></li>
</ul>
<div class="zoom"><img src="https://i.ibb.co/KLtXjgW/md-5a926256440ed.jpg"></div>
<div class="zoom"><img src="https://i.ibb.co/KLtXjgW/md-5a926256440ed.jpg"></div>
<div class="zoom"><img src="https://i.ibb.co/KLtXjgW/md-5a926256440ed.jpg"></div>
<div class="zoom"><img src="https://i.ibb.co/KLtXjgW/md-5a926256440ed.jpg"></div>
$(function() {
$('.btn-25').click(function() {
$('.zoom').addClass('zoom-25').removeClass('zoom-33 zoom-50 zoom-100');
});
$('.btn-33').click(function() {
$('.zoom').addClass('zoom-33').removeClass('zoom-25 zoom-50 zoom-100');
});
$('.btn-50').click(function() {
$('.zoom').addClass('zoom-50').removeClass('zoom-25 zoom-33 zoom-100');
});
$('.btn-100').click(function() {
$('.zoom').addClass('zoom-100').removeClass('zoom-25 zoom-33 zoom-50');
});
});
Чтобы сохранялся добавленный класс к zoom
и у списка active