Как повесить событие клика на элементы с одинаковыми классами jQuery?

подскажите пожалуйста есть 7 списков (li), на один я повесил клик для появление блока с текстом снизу. Как сделать для оставшихся 6, чтобы не менять и не делать разные классы ? Можно ли для одинаковых классов сделать событие click. (Блок в виде списка ul и li)

 $('.faq-item').click(function () {
    $('.faq-item__hide').toggle();
    $('.fas.fa-chevron-up.fa-up').toggleClass('animate-rotate');
  });
<ul class="faq-list">
<li class="faq-item">I have doubts.<i class="fas fa-chevron-up fa-up"></i>
<p class="faqitem__hide">llllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllll.</p></li>
</ul>


Ответы (1 шт):

Автор решения: Алексей Шиманский

$(document).on('click', '.faq-item', function() {
  $(this).children('.faqitem__hide').toggle();
  $(this).children('.fa-up').toggleClass('animate-rotate');
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.0.0/jquery.min.js"></script>
<ul class="faq-list">
  <li class="faq-item">I have doubts.<i class="fas fa-chevron-up fa-up"></i>
    <p class="faqitem__hide">llllllllllllllllllllll.</p>
  </li>
  
  <li class="faq-item">222.<i class="fas fa-chevron-up fa-up"></i>
    <p class="faqitem__hide">222 text .</p>
  </li>
  
  <li class="faq-item">333.<i class="fas fa-chevron-up fa-up"></i>
    <p class="faqitem__hide">333 text.</p>
  </li>
</ul>

→ Ссылка