diff --git a/pyscriptjs/examples/pylist.py b/pyscriptjs/examples/pylist.py
new file mode 100644
index 0000000..32a0bcf
--- /dev/null
+++ b/pyscriptjs/examples/pylist.py
@@ -0,0 +1,88 @@
+from datetime import datetime as dt
+from xml.dom.pulldom import END_ELEMENT
+from js import console, HTMLElement, document
+
+
+def add_classes(element, class_list):
+ for klass in class_list.split(' '):
+ element.classList.add(klass)
+
+def create(what, id_=None, classes=''):
+ element = document.createElement(what)
+ if id_:
+ element.id = id_
+ add_classes(element, classes)
+ return Element(id_, element)
+
+
+class PyList:
+ def __init__(self, parent):
+ self.parent = parent
+ self._children = []
+ self.id = self.parent.id
+
+ def connect(self):
+ self.md = main_div = document.createElement('div');
+ main_div.id = self.id + "-list-tasks-container"
+
+ for klass in "flex flex-col-reverse mt-4".split(' '):
+ main_div.classList.add(klass)
+
+ self.parent.appendChild(main_div)
+
+ def add(self, data, labels):
+ child = PyItem(self, data, labels)
+ return self._add(child)
+
+ def _add(self, child_elem):
+ self._children.append(child_elem)
+ console.log("appending child", child_elem.element)
+ self.md.appendChild(child_elem.create().element)
+ return child_elem
+
+class PyItem(Element):
+ def __init__(self, parent, data, labels):
+ self._parent = parent
+ self.id = f"{self._parent.id}-c-{len(self._parent._children)}"
+ self.data = data
+ self.data['id'] = self.id
+ self.labels = labels
+
+ super().__init__(self.id)
+
+ def create(self):
+ console.log('creating section')
+ new_child = create('section', self.id, "task bg-white my-1")
+ console.log('creating values')
+ values = ' - '.join([self.data[f] for f in self.labels])
+ console.log('creating innerHtml')
+ new_child._element.innerHTML = f"""
+
+ """
+
+ check = new_child.select('input').element
+ check.onclick = self.check_task
+ console.log('returning')
+ return new_child
+
+ def check_task(self, evt=None):
+ self.data['done'] = not self.data['done']
+ if self.data['done']:
+ self.add_class("line-through")
+ else:
+ self.remove_class("line-through")
+
+
+def add_task(*ags, **kws):
+ console.log(new_task_content.value)
+ console.log('adding', myList)
+ task = {
+ "content": new_task_content.value,
+ "done": False,
+ "created_at": dt.now()
+ }
+ myList.add(task, ['content'])
+ new_task_content.clear()
diff --git a/pyscriptjs/examples/todo-pylist.html b/pyscriptjs/examples/todo-pylist.html
new file mode 100644
index 0000000..015b197
--- /dev/null
+++ b/pyscriptjs/examples/todo-pylist.html
@@ -0,0 +1,56 @@
+
+
+
+
+
+
+ Todo App
+
+
+
+
+
+
+ - paths:
+ - /utils.py
+
+
+
+
+
+
+
+
+
+
+
+
+
+