Get outerHTML text in div

Question

I am working on Google Tag Manager and I am having trouble getting the outerHTML text.

<div class="a"><i class="b"></i> email </div>

I tried multiple ways but I can't get it to work.

document.querySelector("div.a").outerHTML;
document.querySelector("div.a").outerHTML.textContent;

console.log(document.querySelector("div.a").outerHTML);
console.log(document.querySelector("div.a").outerHTML.textContent);

<div class="a"><i class="b"></i> email </div>

Answer 1

Here is the documentation on Node.textContent : https://developer.mozilla.org/en-US/docs/Web/API/Node/textContent

In the snippet below, notice that .textContent includes the leading/trailing spaces, whereas .innerText does not

const div = document.querySelector("div.a");

console.log({
  outerHTML: div.outerHTML,
  innerHTML: div.innerHTML,
  innerText: div.innerText,
  textContent: div.textContent
});

<div class="a"><i class="b"></i> email </div>