Property 'checked' does not exist on type 'Element' while variable are NodeList

trying to select all radio input and their checked status using below code

  const radioInput = document.querySelectorAll("input[type=radio]");
  radioInput.forEach((r) => (r.checked = r.defaultValue === 'whatever'));

this is working in javascript but now trying to convert into typsscript and now it

gives below typing error inside forEach()

Property 'checked' does not exist on type 'Element'.

also when we hover on radioInput variable, its display NodeList<Element>

the tsconfig.json have below entry

"lib": [
      "es2022",
      "dom",
      "dom.iterable"
    ],

How can we fix this?

Already checked similar questions, most of answer are React related while my code is written in typescript only (.ts, not .tsx)

Working Demo

To access checked you need to consider element as HTMLInputElement instead of HTMLElement, i.e. (r: HTMLInputElement)

Here is the example from your demo:

// Import stylesheets
import './style.css';

// Write TypeScript code!

const radioInput = document.querySelectorAll('input[type=radio]');
radioInput.forEach((r: HTMLInputElement) => (r.checked = r.defaultValue === 'X'));

const enum Shape {
  Circle,
  Square,
}

console.log(Shape['1']);