如何在单击时在同一窗口中显示不同的内容？

<button id="myButton">点击我</button>
<div id="content"></div>

var button = document.getElementById("myButton");
var content = document.getElementById("content");

button.addEventListener("click", function() {
  // 修改内容
  content.innerHTML = "不同的内容";
});

<button id="myButton">点击我</button>
<div id="content"></div>

$("#myButton").click(function() {
  // 修改内容
  $("#content").html("不同的内容");
});

<div id="app">
  <button @click="changeContent">点击我</button>
  <div>{{ content }}</div>
</div>

new Vue({
  el: "#app",
  data: {
    content: ""
  },
  methods: {
    changeContent: function() {
      // 修改内容
      this.content = "不同的内容";
    }
  }
});