02.Event tracker

function solve(){
    let eventField = document.getElementById('event');
    let noteField = document.getElementById('note');
    let dateField = document.getElementById('date');

    let upcomingList = document.getElementById('upcoming-list');
    let endedList = document.getElementById('events-list');

    let saveBtn = document.getElementById('save');
    saveBtn.addEventListener('click', function (e) {
        e.preventDefault();
        saveEvent();
    })

    let deleteBtn = document.querySelector('.btn.delete');
    deleteBtn.addEventListener('click', deleteEvents);

    function saveEvent() {
        let event = eventField.value;
        let note = noteField.value;
        let date = dateField.value;

        if (!event || !note || !date) {
            return;
        }

        let eventP = createElement('p', `Name: ${event}`);
        let noteP = createElement('p', `Note: ${note}`);
        let dateP = createElement('p', `Date: ${date}`);

        let article = createElement('article', null, {}, eventP, noteP, dateP);

        let editBtn = createElement('button', 'Edit', { class: 'btn edit' });
        editBtn.addEventListener('click', editElement);

        let doneBtn = createElement('button', 'Done', { class: 'btn done' });
        doneBtn.addEventListener('click', doneElement);

        let buttonsDiv = createElement('div', null, { class: 'buttons' }, editBtn, doneBtn);

        let container = createElement('div', null, { class: 'event-container' }, article, buttonsDiv);

        let li = createElement('li', null, { class: 'event-item' }, container);

        upcomingList.appendChild(li);

        eventField.value = '';
        noteField.value = '';
        dateField.value = '';

    }

    function editElement(event) {
        let currentEvent = event.target.parentElement.parentElement;
        let eventName = currentEvent.querySelector('.event-container p:first-of-type').textContent.replace('Name: ', '');;
        let note = currentEvent.querySelector('.event-container p:nth-child(2)').textContent.replace('Note: ', '');
        let date = currentEvent.querySelector('.event-container p:last-of-type').textContent.replace('Date: ', '');

        eventField.value = eventName;
        noteField.value = note;
        dateField.value = date;

        currentEvent.remove();
    }

    function doneElement (event) {
        let currentEvent = event.target.parentElement.parentElement;
        let newLiChild = currentEvent.querySelector('.event-container article');

        let newLi = createElement('li', null, { class: 'event-item' }, newLiChild);
        endedList.appendChild(newLi);
        currentEvent.parentElement.remove();
    }

    function deleteEvents () {
        endedList.innerHTML = '';
    }

    function createElement(type, content, attributes = {}, ...children) {
        let element = document.createElement(type);

        if (content) {
            element.textContent = content;
        }

        for (let attr in attributes) {
            if (attr === 'class') {
                element.classList.add(...attributes[attr].split(' '));
            } else {
                element.setAttribute(attr, attributes[attr]);
            }
        }

        for (let child of children) {
            if (typeof child === 'string') {
                child = document.createTextNode(child);
            }
            element.appendChild(child);
        }

        return element;
    }
}