Открытие только одного изображения по клику?

Question

[Kotovasofa]

Как правильно реализуется такое:

$(document).ready(function(){
    $('#timeline .demo-card .body .image-wrapper').click(function(e){ 
        $('#timeline .demo-card .body img').addClass('timeline-img-max'); 
    })
})

При клике на #timeline .demo-card .body .image-wrapper все картинки с аналогичными путями получают класс timeline-img-max который фиксирует их по центру. Как указать в скрипте, чтобы класс добавлялся только к изображению, который является дочерним от wrapper'а по которому произошел клик.

Т.е., сейчас при клике по wrapper - все картинки получают класс, нужно чтобы получала одна, которая находится внутри wrapper.

Answer 1

[hellcaster]

const wrappers = document.querySelector(`.#timeline .demo-card .body .image-wrapper`);

wrappers.forEach((wrapper) => {
	wrapper.addEventListener(`click`, (event) => {
		event.preventDefault();

		event.target.querySelector(`img`).classList.add(`timeline-img-max`);
	});
});

Comments

[Kotovasofa]

Я так понимаю ключевым здесь является tagret? Который указывает на конкретный элемент?