Make list of questions / answers collapsable

Hi, I need to create a js so that the following list is entirely collapsed at the beginning and user can expend answers when clicking on the question title. The structure of the html has to say the same. Each question/answer pair is in a "schema-faq-section" class. The title that need to be clicked are in "schema-faq-question" classes and the core of the answer is in "schema-faq-answer" classes. The javascript code produced must be as light as possible. Thanks a lot ! Exemple (the number of question/answer can vary, the code must handle that) : <div class="schema-faq wp-block-yoast-faq-block"><div class="schema-faq-section"><strong class="schema-faq-question">Question 1</strong> <p class="schema-faq-answer">Answer 1</p> </div> <div class="schema-faq-section"><strong class="schema-faq-question">Question 2</strong> <p class="schema-faq-answer">Answer 2</p> </div> <div class="schema-faq-section"><strong class="schema-faq-question">Question 3</strong> <p class="schema-faq-answer">Answer 3</p> </div> </div>