上のキャプチャのような、トグルで質問への回答の表示・非表示を切り替えるサンプルプログラムを紹介します。
HTMLで質問と回答の内容を記述する
まずは、HTMLでQ&Aを作っていきましょう。
HTML
トグルに対応させる（jQuery）
先ほど作ったQ&Aにトグルを対応させましょう。
トグルの基本については以下の記事を参考にしてみてください。
jQuery
デザインを整える（CSS）
上の段階でトグル式Q&Aは完成していますが、デザインがいまいちです。
なので、各要素にClassを付与し、CSSでデザインを整えていきましょう。
CSS
