{% extends "index.html" %} {% block title %}{{ config.title }} — {{ page.title }}{% endblock title %} {% block content %} <main class="recipe"> <h2>{{ page.title | upper }}</h2> <hr> {{ macro::recipe_image() }} <div class="meta"> {{ macro::recipe_meta() }} </div> {{ page.content | safe }} <hr> {{ macro::recipe_taxonomies() }} </main> {% endblock content %} {% block script %} <script> let list_items = document.querySelectorAll('ol li'); for(let i=0; i<list_items.length; i++){ list_items[i].addEventListener('click', function(){ this.classList.toggle("completed"); }, false); } </script> {% endblock script %}