JSFiddle - React, Tailwind, and code Playground

HTML

<ul id="todos-container"></ul>
<form id="createTodoForm">
    <label for= "owner"> Owner</label>
    <input id="owner" type="text" placeholder="Max Mustermann"/>
    <label for= "task"> Aufgabe</label>
    <input id="task" type="text" placeholder="zu erledigende Aufgabe"/>
    <label for= "date"> Datum</label>
    <input id="date" type="text" placeholder="JJJJ-MM-TT"/>
    <button type="submit" id="addTodoButton">eintragen</button>
</form>

CSS

.state-error {
    border: 1px solid red;
}

JavaScript

/**
 * ---
 * Zehnte Aufgabe:     Aufräumen: Lösche alles, was mit den einfachen Objekten zu tun hat, so das 
 *                     alles nur noch über die Todo-Klasse läuft. Lösche Kommentare, die du nicht mehr 
 *                     benötigst. Entferne ggf. überflüssige Funktionsaufrufe und so weiter.
 * Elfte Aufgabe:      Guck dir den Umgang mit dem LocalStorage an. Was ist der LocalStorage? Welche
 *                     Daten kann man damit speichern? Wo werden die Daten gespeichert? Mit wie viel 
 *                     Speicherplatz darf man rechnen? 
 * Zwölfte Aufgabe:    Mach dir Gedanken darüber, wie Todos im LocalStorage gespeichert werden können.
 *                     Wie können einzelne Todos gespeichert werden und wie werden sie später korrekt
 *                     wieder ausgelesen? Skizziere deine Ideen so, dass ich sie verstehen kann.
 *                     Hinweis: Wahrscheinlich wirst du die Todos um einen eindeutigen Schlüssel
 *                     erweitern müssen, also ein neues Attribut "id", um einen bestimmten Todo
 *                     ansprechen zu können.
 * ---
 * 13.
 *     Neu hinzugekommen ist die Klasse Storage. Dies ist eine 
 *     Hilfsklasse, die den Zugriff auf den Zugriff auf den 
 *     Storage erleichert. Guck dir die Klasse an und versuche
 *     nachzuvollziehen, was sie tut.
 * 14.
 *     Alle Todo-Objekte sollen nun über die Storage-Klasse gespeichert
 *     werden. Es wurde bereits ein Key angelegt, unter dem die todos
 *     abgespeichert werden können. Der Befehl sieht etwa so aus:
 *     Storage.write(Storage.keys.todosList, todos);
 *     Die write-Funktion übernimmt das Umwandeln in einen JSON-String.
 *
 */

$(document).ready(function() {
   
     
    // NEU:
    // Neues Array mit Todo-Elementen. Die Elemente hier sind Instanzen von Todo.
    var todosNew = [];
    
    // Beispiel: Todos über die Todo-Klasse anlegen:
    var todo = new Todo();
    todo.setDescription('Luli muss sich einen tollen...