Markdown FAQs different section

Hi all, I made my expandable FAQs list in markdown, but I would like the questions to be categorized (as you can see if you expand it all). Anyone knows what to put in markdown so the categories don't get hidden when not expanded?

Thank you!!
https://daffodil-goldfish-8xw8.squarespace.com/faqs
pw: 120896

It depends on the way you've coded it. You could use the built in accordion block instead, and have one for each category? Would that work?

Hi @Ziggy that's what I was thinking too, but that actually doesn't work because then there is a big gap between each accordion when they are not open. 
This is the code I used:

<script>
$(document).ready(function(){
$('.markdown-block .sqs-block-content h4').addClass('ui-closed').css('cursor','pointer');
$(".markdown-block .sqs-block-content h4").nextUntil("h4").slideToggle();
$(".markdown-block .sqs-block-content h4").click(function() {

$(this).nextUntil("h4").slideToggle();
$(this).toggleClass('ui-closed ui-open');
});
});
</script>

As in the attached picture, I thought it could work when I write the category without the #### but that doesn't work and the category get's hidden together with the answers.

Thank you!!

13 minutes ago, lucylou12 said:

.nextUntil("h4")

This is the problem, it contains everything from one H4 until the next H4. It's not been designed to have other titles in between, and I'm afraid I don't have an easy solution to change this. The only thing you could do is add the category as another H4 without anything after it, and then maybe make them bold? If you made them bold and italic you may be able to use that to target the category H4s.