TodoWithoutReact.js

function Todo({todo, key, onToggle}) {
  const onToggleEvent = `__Todo_${key}_onCheckEvent`;
  window[onToggleEvent] = onToggle;
  return `
    <li>
      <input
        type="checkbox"
        onclick="${onToggleEvent}()"
        ${todo.done ? 'checked' : ''}
      />
      ${todo.done ?
        `<span style="text-decoration: line-through">${todo.title}</span>` :
        todo.title}
    </li>
  `;
}

function TodoApplication() {
  return `
    <ul>
      ${todos.map((todo, key) =>
        Todo({
          todo,
          key,
          onToggle: () => {
            todos[key].done = !todos[key].done;
            render();
          }
        })).join('')
      }
    </ul>
  `;
}

let todos = [
  {title: 'Write a TODO app without React', done: true},
  {title: 'Write the rest of the article', done: false},
];

function render() {
  document.getElementById('app').innerHTML = TodoApplication();
}

render();