<ul class="menu">
  <li><button class="btn">選單1</button></li>
  <li><button class="btn">選單2</button></li>
  <li><button class="btn">選單3</button></li>
  <li><button class="btn">選單4</button></li>
  <li><button class="btn">選單5</button></li>
  <li><button class="btn">選單6</button></li>
 </ul>

body {
  box-sizing: border-box;
}

.menu {
  width: 500px;
  margin: 0 auto;
  margin-top: 10px;
  li {
    border: 1px solid gray;
    padding: 5px;
    margin-bottom: 10px;
    &:hover {
      background-color: yellow;
      cursor: pointer;
    }
    &.active {
      background-color: yellow;
      cursor: pointer;
    }
  }
}

$(function () {
  $(".btn").click(function (e) {
    e.preventDefault();
    $(this).parent().toggleClass("active");
  });
});