При нажатии на логотип верхняя секция должна поменяться, но она просто пропадает. Если после нажать на другой логотип, то ничего не случится
$('.nav_rev > div').click(function() {
const revID = $(this).data('revid');
$('.nav_rev > div').not(this).removeClass('active');
$('this').addClass('active');
$('.item_rev').not(revID).removeClass('active');
$('revID').addClass('active');
})
#reviews
padding: 270px 0
background-size: cover
background-position: center
background-repeat: no-repeat
background-image: url('../img/reviews/bg.svg')
.item_rev
text-align: center
display: none
animation: opac .6s
&.active
display: block
.quotes
color: $dark_accent
font-size: 22px
margin: 0 auto 16px
max-width: 660px
>img
width: 80px
height: 80px
border-radius: 50%
>.name
margin-top: 16px
>.name, >.position
color: #111
font-weight: 900
.line
height: 1px
width: 100%
background-color: #DEC9FA
margin: 56px 0
.nav_rev
display: -webkit-flex
display: -moz-flex
display: -q-flex
display: flex
align-items: center
justify-content: space-between
flex-wrap: wrap
>div
cursor: pointer
width: 16%
filter: grayscale(1)
transition: all .4s ease
display: -webkit-flex
display: -moz-flex
display: -q-flex
display: flex
align-items: center
justify-content: center
&.active
filter: grayscale(0)
transform: scale(1.1)
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.1/jquery.min.js"></script>
<section id="reviews">
<div class="container">
<div id="rev_1" class="item_rev active">
<div class="quotes">Tonkean — это сервис для бизнес-аналитики. Он автоматизирует отслеживание и мониторинг критически важных бизнес-данных. ИИ активно ищет обновления команд и организует их в одну панель вместе с ключевыми показателями из других используемых инструментов.
</div>
<img src="img/reviews/avatar.png" alt="ava">
<div class="name">Guillaume Cabane</div>
<div class="position">CTO @ tonkean</div>
</div>
<div id="rev_2" class="item_rev">
<div class="quotes">Lorem ipsum dolor sit amet consectetur, adipisicing elit. A saepe optio est ullam mollitia minus placeat consequatur, facilis assumenda, perspiciatis ab similique odit maxime? Iure rem eos provident impedit placeat.
</div>
<img src="img/reviews/avatar.png" alt="ava">
<div class="name">Guillaume Cabane</div>
<div class="position">CTO @ tonkean</div>
</div>
<div id="rev_3" class="item_rev">
<div class="quotes">это онлайн-сервис, который позволяет собирать информацию по заданным параметрам поиска. Вы можете искать информацию по двум целям: По людям, используя адреса электронной почты. По компаниям, используя доменные имена.
</div>
<img src="img/reviews/avatar.png" alt="ava">
<div class="name">Guillaume Cabane</div>
<div class="position">CTO @ tonkean</div>
</div>
<div id="rev_4" class="item_rev">
<div class="quotes">Каждый из этих подходов имеет право на жизнь, так как позволяет оптимизировать ту или иную метрику разработки, жертвуя чем-то другим. Например, ускоряя TTM взамен на повышенную скорость накопления технического долга.
</div>
<img src="img/reviews/avatar.png" alt="ava">
<div class="name">Guillaume Cabane</div>
<div class="position">CTO @ tonkean</div>
</div>
<div id="rev_5" class="item_rev">
<div class="quotes">>немецкая автомобилестроительная компания, выпускала легковые автомобили, мотоциклы, велосипеды, микроавтобусы и другую технику.
</div>
<img src="img/reviews/avatar.png" alt="ava">
<div class="name">Guillaume Cabane</div>
<div class="position">CTO @ tonkean</div>
</div>
<div class="line"></div>
<div class="nav_rev">
<div data-revid="#rev_1" class="active"><img src="img/reviews/partner_1.svg" alt=""></div>
<div data-revid="#rev_2"><img src="img/reviews/partner_2.svg" alt=""></div>
<div data-revid="#rev_3"><img src="img/reviews/partner_3.svg" alt=""></div>
<div data-revid="#rev_4"><img src="img/reviews/partner_4.svg" alt=""></div>
<div data-revid="#rev_5"><img src="img/reviews/partner_5.svg" alt=""></div>
</div>
</div>
</section>