Hide content below h2 tag and make it toggle by clicking the h2

Hide content below h2 tag and make it toggle by clicking the h2

Anyone having a good idea?

I would like to hide all content below h2 tags and bind a function to each h2 that toggle that hidden content below the H2.

The content below h2 could be div, ul/li, a, table and so on. It could also be plain text without a tag. 

Example:
<h1>Title</h1>
Intro text
<div>
    <h2>header 1</h2>
    Some text 1
    <ul><li>Some text 2</li><ul>
    <p>Some text 3</p>
    <h2>header 2</h2>
    Some text 4
</div>
Some text 5


I would like it to render like this

Title
Introtext
header 1
header 2
Some text 5

... and clicking header 1 would toggle
Some text 1
- Some text 2
Some text 3

... and header 2 would toggle 
Some text 4

//Thanks