<div id="app">
  <div @click="handleDivClick" :class="[activated, activatedOne]">
    hello world
  </div>
</div>
.activated {
  color: red;
}
var app = new Vue({
  el: "#app",
  data: {
    activated: "",
    activatedOne: "activated-one"
  },
  methods: {
    handleDivClick: function () {
      // if(this.activated === "activated") {
      //   this.activated = ""
      // } else {
      //   this.activated = "activated"
      // }
      console.log(this.activated === "activated");
      this.activated = this.activated === "activated" ? "" : "activated";
    }
  }
});

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

  1. https://cdnjs.cloudflare.com/ajax/libs/vue/2.7.8/vue.min.js