<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>

<button class="btn-1">버튼1</button>

<div></div>
div {
  width: 500px;
  height: 500px;
  border: 10px solid gold;
  margin: 0 auto;
}

div.active {
  background-color: red;
}

console.clear();

//실무방식
$(".btn-1").click(function () {
  let has = $("div").hasClass("active");
  console.log(has);
  if (has) {
    $("div").removeClass("active");
  } else {
    $("div").addClass("active");
  }
});

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.