アコーディオンに矢印をつける

<dl id="Menu">
  <dt>aaa</dt>
  <dd>bbb</dd>
  <dt>ccc</dt>
  <dd>ddd</dd>
</dl>

active classが付いている時とついていないときで表示を分ける.

#Menu dt {
  display: block;
  height: 50px;
  text-align: left;
  cursor: pointer;
  font-weight: 300;
  background-image: url("../images/xxx.png");
  background-position: right;
  background-repeat: no-repeat;
}
#Menu dt.active {
  background-image: url("../images/xxx.png");
  background-position: right;
  background-repeat: no-repeat;
}
#Menu dd{
  text-align: left;
  display:none;
  margin: 10px 20px 30px;
}

slideToggle() を利用する.

// For Accordion
$("#Menu dt").on("click", function() {
  $(this).next().slideToggle();
  $(this).toggleClass("active");
});