<div class="faq__item-wrapper"> {% for block in section.blocks %} {% case block.type %} {% when 'question_three' %} <div class="faq__item"> <div class="faq-question">{{ block.settings.question }}</div> <div class="faq-answer">{{ block.settings.answer }}</div> </div> {% endcase %} {% endfor %} </div> <script> $(document).ready(function(){ $('.faq-question').click(function(){ $(this).toggleClass('active'); $(this).next('.faq-answer').toggleClass('active'); }); }); </script>
Preview:
downloadDownload PNG
downloadDownload JPEG
downloadDownload SVG
Tip: You can change the style, width & colours of the snippet with the inspect tool before clicking Download!
Click to optimize width for Twitter