Получить данные DOM из объекта

При нажатии на кнопку «Добавить статью», появляется форма с двумя полями: Заголовок статьи и Описание статьи и кнопкой закрыть. После нажатия кнопки «Сохранить», статья появляется в списке. При нажатии кнопки «Редактировать» у статьи, вместо заголовка и описания появляются поля для редактирования. При нажатии кнопки «Удалить» у статьи, статья удаляется из списка. Данные о всех элементах должны храниться в свойстве articles объекта List, а также добавляться, редактироваться и удаляться.

Вопрос в том, как получать данные о DOM из объекта Item чтобы была возможность отредактировать статью, а затем сохранённые данные передать в объект List и сохранить. То есть как обработать нажатие на кнопки каждой из статей.Нужно обращаться глобально через document или же сохранять данные о DOM в массиве объектов _self.articles.

Была идея присваивать id каждому созданному Item, чтобы потом по нему получать доступ к child section.articles, но структура страницы в любой момент может измениться, придётся править код, а это не дело. Как быть ?

Ссылка на полный код https://jsfiddle.net/XoldpandaX/4u3xkhsy/6/

    var List = function() {
    var _self = this;
    _self.articles = [];
    var
        body        = document.querySelector('body'),        // body страницы
        addButton   = document.querySelector('._add'),      // кнопка добавить статью
        articles    = document.querySelector('.articles'); // блок статей

    _self.add = function(data) { // сохранить статью в список
        _self.articles.push(data);
    };
    // обработчики кнопок
    addButton.onclick = function() {
        var modal   = document.createElement('div'); // Модальное окно
        modal.className = 'modal';
        modal.innerHTML += View.drawTheModal('Добавить статью',
                                             'Название',
                                             'Описание',
                                             'https://www.youtube.com/video',
                                             'Добавить');
        body.style.overflow = 'hidden';
        body.appendChild(modal);
    };
    body.addEventListener('click', function(e) { // обработка кнопок модального окна
        if (e.target.classList.contains('modal__close')) { // кнопка закрыть
            removeModal();
            body.style.overflow = 'unset';
        } else if (e.target.classList.contains('btn_add-article')) { // кнопка добавить
            var
                modalBodyForm   = body.lastElementChild.firstElementChild.childNodes[1].firstElementChild,
                article = { // объект с заголовком и описанием
                    //значения полей ввода
                    id : _self.articles.length,
                    length: _self.articles.length,
                    youtobeLink: modalBodyForm.childNodes[0].value,
                    title: modalBodyForm.childNodes[1].value,
                    description: modalBodyForm.childNodes[2].value
                },
                item = new Item(article);
            _self.add(item); // добавляем объект article в массив
            displayNewArticleOnPage(article); // отображаем новывй article в блоке articles
            removeModal();
            body.style.overflow = 'unset';
        }
    });
    function displayNewArticleOnPage(data) {
        var article = document.createElement('div');
        article.className = 'article clearfix';
        article.innerHTML += View.drawTheArticle(
            data.youtobeLink,
            data.title,
            data.description
        );
        articles.appendChild(article);
    }
    function removeModal() {
        var modal = body.lastElementChild;
        body.removeChild(modal);
        return true;
    }
};