How to use Vuejs to replace this jquery code?

Question

I have this code below :

log(n) {
  $('#log').append('<div></div>').append(document.createTextNode(n));     
},

The jquery function will inject text into the code below :

<div id='log'></div>

How to do this by using Vue.js? please help me Sorry for my bad English

Answer 1

If you wan't to add an text message to a specific HTML element, there is no need to use VueJs for this. You could just rewrite the jQuery code into vanilla Javascript:

function log(n) {
  const divElement = document.createElement("div")
  const textNode = document.createTextNode(n)
  document.getElementById('log')
    .append(divElement);

  divElement.append(textNode);
}


// run
log('hello world')

<div id="log"></div>