How to uncheck checkboxes on a button click?

I have the following 3 input checkboxes, after checking the checkboxes, I would like to clear all the checked items after the "Clear Checkbox" button is clicked. I attempted the following but it doesn’t work.

Stackblitz working Example

app.component.html

<ul *ngFor="let d of data">
  <li>
    <input id="checkbox" type="checkbox" class="checkbox" />
    {{ d }}
  </li>
</ul>

<button (click)="myFunction()">Clear Checkbox</button>

app.component.ts

export class AppComponent {
  data = ['tea', 'coffe', 'soda'];
  public myFunction() {
    (<HTMLInputElement>document.getElementById('checkbox')).checked === false;
  }
}

>Solution :

You can use document.querySelectorAll() to uncheck all the checkboxes.

StakBlitz Working Example

In myFunction, you code should be as below:

document.querySelectorAll('.checkbox').forEach(_checkbox=>{
    (<HTMLInputElement>_checkbox).checked = false;
});

Also, make sure you are assinging false value (=) not checking (===)!