Как удалять элементы из массива при клике на элемент и сам элемент?

Имеется массив объектов и генерируемые блоки с информацией из массива. При клике на крестик в блоке должен удаляться этот блок и удаляться элемент массива для этого блока. Как это сделать ? Пока нашел вариант только по сравнению значения объекта в массиве с event.target.innerHTML , но мне нужно именно крестик.

Код удаления :

todo.addEventListener('click', function(event){//todo-это обертка блоков
        todoArray.forEach((item, i ) => {
            console.log(item.close);
            console.log(Symbol(event.target.textContent));
            if (item.close == event.target.textContent) {
                console.log("ok");
            }
        });
    });

Код добавления карточки:

addTask.addEventListener('click', function(){
        
        let task = {
            title: todoTitle.value,
            todoText: todoText.value,
            date: date.value,
            remaining: '',
            close: 'x'
        };
        if (todoTitle.value == "" || todoText.value == "") {
            alert("Введите данные для задачи!");
        } else {
            todoArray.push(task);
            showBadge();
            localStorage.setItem("todo", JSON.stringify(todoArray));
            todoTitle.value = "";
            todoText.value = "";
            date.value = "";
        }
    });

Переменная с карточкой:

displayTask += `<li class="todo__block" id="item_${i}">
                                <div class="todo__close" id="deleteTask">&times;</div>
                                    <h1 class="todo__block-title">${item.title}</h1>
                                    <h3 class="todo__block-time"><span>Дата завершения:</span> ${item.date}</h3>
                                    <p class="todo__block-text">${item.todoText}</p>
                                    <div class="beforeend" id=timer_${i}>
                                        До конца выполнения:
                                        <span class="hours">${item.remaining.hours}</span>
                                        <span>:</span>
                                        <span class="minutes">${item.remaining.minutes}</span>
                                        <span>:</span>
                                        <span class="seconds">${item.remaining.seconds}</span>
				                    </div>
                            </li>`;