<div id="rank-math-faq" class="rank-math-block">
  <div class="rank-math-list ">
    <div class="rank-math-list-item">
      <h3 class="rank-math-question ">Question 0?</h3>
      <div class="rank-math-answer ">
        <p>This is the answer to this question.</p>
      </div>
    </div>
    <div class="rank-math-list-item">
      <h3 class="rank-math-question ">Question 1?</h3>
      <div class="rank-math-answer ">
        <p>This is the answer to this question.</p>
      </div>
    </div>
    <div class="rank-math-list-item">
      <h3 class="rank-math-question ">Question 2?</h3>
      <div class="rank-math-answer ">
        <p>This is the answer to this question.</p>
      </div>
    </div>
    <div class="rank-math-list-item">
      <h3 class="rank-math-question ">Question 3?</h3>
      <div class="rank-math-answer ">
        <p>This is the answer to this question.</p>
      </div>
    </div>
  </div>
</div>

#rank-math-faq .rank-math-list-item {
    margin-bottom: 1em;
    margin-top: 1em;
    border-bottom: 1px solid #fff;
}

.rank-math-question {
    cursor: pointer;
    position: relative;
    display: block;
    padding-right: 1em;
    margin-right: 1em;
    font-weight: 300;
    margin-top: 30px;
}

.rank-math-question:after {
    position: absolute;
    right: 5px;
    top: 0;
    content: "\2715";
    transform: rotate(-45deg);
    transition: all 150ms ease-in-out;
}

.rank-math-question.collapse:after {
    transform: rotate(0deg);
}

.rank-math-question:hover {
    opacity: 0.8;
}

(function ($) {
  var rankMath = {
    accordion: function () {
      // START hide all answers by default
      //$('.rank-math-block').find('.rank-math-answer').hide(); // hides all answers by default
      // END hide all answers by default
      
      // START open first answer on load
      $(".rank-math-block").find(".rank-math-answer:not(:first)").hide(); // doesn't hide the first item
      $(".rank-math-block .rank-math-question:first").addClass("collapse");
      // END open first answer on load
      
      $(".rank-math-block")
        .find(".rank-math-question")
        .click(function () {
          //Expand or collapse this panel
          $(this)
            .nextAll(".rank-math-answer")
            .eq(0)
            .slideToggle("fast", function () {
              if ($(this).hasClass("collapse")) {
                $(this).removeClass("collapse");
              } else {
                $(this).addClass("collapse");
              }
            });
          //Hide the other panels
          $(".rank-math-answer")
            .not($(this).nextAll(".rank-math-answer").eq(0))
            .slideUp("fast");
        });

      $(".rank-math-block .rank-math-question").click(function () {
        $(".rank-math-block .rank-math-question")
          .not($(this))
          .removeClass("collapse");
        if ($(this).hasClass("collapse")) {
          $(this).removeClass("collapse");
        } else {
          $(this).addClass("collapse");
        }
      });
    }
  };

  rankMath.accordion();
})(jQuery);