d-kang/todo_code_review.html

## todo_code_review.html
<html>

  <head></head>

  <body>
    <ul id="todo-app">
      <li class="todo"><span>Walk the dog</span></li>
      <li class="todo"><span>Pay bills</span></li>
      <li class="todo"><span>Make dinner</span></li>
      <li class="todo"><span>Code for one hour</span></li>
    </ul>

    <script>
      const addListeners = () => {
        const todos = document.querySelectorAll('.todo > span');

        for (let i = 0; i < todos.length; i++) {
          const todo = todos[i];

          if (typeof todo === 'object') {
            todo.addEventListener('click', (e) => {
              e.target.style = 'text-decoration: line-through';
              alert(`Item ${i + 1}: "${e.target.innerText}" is done!`);
            });
          }
        }
      };

      document.addEventListener("DOMContentLoaded", function (event) {
        addListeners();
      });
    </script>
  </body>
</html>
	<html>

	<head></head>

	<body>
	<ul id="todo-app">
	<li class="todo"><span>Walk the dog</span></li>
	<li class="todo"><span>Pay bills</span></li>
	<li class="todo"><span>Make dinner</span></li>
	<li class="todo"><span>Code for one hour</span></li>
	</ul>

	<script>
	const addListeners = () => {
	const todos = document.querySelectorAll('.todo > span');

	for (let i = 0; i < todos.length; i++) {
	const todo = todos[i];

	if (typeof todo === 'object') {
	todo.addEventListener('click', (e) => {
	e.target.style = 'text-decoration: line-through';
	alert(`Item ${i + 1}: "${e.target.innerText}" is done!`);
	});
	}
	}
	};

	document.addEventListener("DOMContentLoaded", function (event) {
	addListeners();
	});
	</script>
	</body>
	</html>