It's not clear that you defined Timer at the class level, this would create an error. Also, members should start with a lowercase character, while classes start with an uppercase character. This is more convention than a rule, but it's a good one to follow.

JavaScript is case-sensitive, so you must use innerHTML, not innerhtml.

Using bind(this) is generally safe and doesn't leak any extra memory, assuming you clear the interval eventually.

You should be using automatic rerendering when possible; direct DOM manipulation is not recommended, but technically acceptable as long as you use lwc:dom="manual".

I wrote up an example using the recommended technique, as well as the not recommended technique you attempted.

import { LightningElement } from "lwc";

export default class Recommended extends LightningElement {
  count = 5;
  timer;
  connectedCallback() {
    this.timer = setInterval(() => {
      if (!this.count) {
        clearInterval(timer);
      } else {
        this.count--;
      }
    }, 1000);
  }
  disconnectedCallback() {
    clearInterval(timer);
  }
}

<!-- Recommended approach -->
<template>
    <div>{count}</div>
</template>

import { LightningElement } from "lwc";

export default class NotRecommended extends LightningElement {
  timer;
  connectedCallback() {
    let count = 5;
    this.timer = setInterval(() => {
      if (!count) {
        clearInterval(this.timer);
      } else {
        count--;
        this.template.querySelector("div").innerHTML = count;
      }
    }, 1000);
  }
  disconnectedCallback() {
    clearInterval(this.timer);
  }
}

<!-- Not Recommended approach -->
<template>
    <div lwc:dom="manual"></div>
</template>

It's not clear that you defined Timer at the class level, this would create an error. Also, members should start with a lowercase character, while classes start with an uppercase character. This is more convention than a rule, but it's a good one to follow.

JavaScript is case-sensitive, so you must use innerHTML, not innerhtml.

Using bind(this) is generally safe and doesn't leak any extra memory, assuming you clear the interval eventually.

You should be using automatic rerendering when possible; direct DOM manipulation is not recommended, but technically acceptable as long as you use lwc:dom="manual".

I wrote up an example using the recommended technique, as well as the not recommended technique you attempted.

import { LightningElement } from "lwc";

export default class Recommended extends LightningElement {
  count = 5;
  timer;
  connectedCallback() {
    this.timer = setInterval(() => {
      if (!this.count) {
        clearInterval(this.timer);
      } else {
        this.count--;
      }
    }, 1000);
  }
  disconnectedCallback() {
    clearInterval(timer);
  }
}

<!-- Recommended approach -->
<template>
    <div>{count}</div>
</template>

import { LightningElement } from "lwc";

export default class NotRecommended extends LightningElement {
  timer;
  connectedCallback() {
    let count = 5;
    this.timer = setInterval(() => {
      if (!count) {
        clearInterval(this.timer);
      } else {
        count--;
        this.template.querySelector("div").innerHTML = count;
      }
    }, 1000);
  }
  disconnectedCallback() {
    clearInterval(this.timer);
  }
}

<!-- Not Recommended approach -->
<template>
    <div lwc:dom="manual"></div>
</template>