The HTML details element is a nice way to create natively expandable content with wide browser support.
This is what it looks like with plain HTML:
This is the title (click to expand)
This is the expandable contentAnd his is what it looks like on my blog, with some CSS adjustments:
This is the title (click to expand)
This is the expandable content
Adding it to hugo
To use it add it to a file called layouts/shortcodes/details.html.
<details>
<summary>{{ .Get 0 | markdownify }}</summary>
{{ .Inner | markdownify }}
</details>
And use it inside your posts like this:
# A blog post
Some content.
{{< details "See details" /*>}}
Expandable details
{{</* /details >}}