Here is the event handler function:

var plateBox = document.querySelector('.services_plate_box'); plateBox.addEventListener('click' ,function (event) { event.preventDefault; var elem = event.target; if(elem.classList.contains('services_plate')) { if(elem.classList.contains('services_plate--show')) { rmClass(elem, 'services_plate--show'); addClass(elem, 'services_plate--hidden') setTimeout(rmClass, 1000, elem, 'services_plate--hidden'); }else{ elem.classList.add('services_plate--show'); } }else{ return; } },true); function rmClass(elem, itemClass) { elem.classList.remove(itemClass); } function addClass(elem, itemClass){ elem.classList.add(itemClass); }

it checks if a click occurs on an element with a particular class, then it performs actions.
Tell me how to add a check that event.target is a descendant of an element with this class and apply actions to this element?

    1 answer 1

    You just need to get the parent element and do the same check (or some other).

    You can get the parent element using the Node.parentElement() or Node.parentNode() functions. I.e

     var parent = event.target.parentElement();

    Accordingly, you can go up one level if you are interested not only in the immediate parent, until you find the element or until you reach null and the document node, depending on which method you use.

    Read more about these methods on the MDN website.

    • @ RusssCoder; I looked in the direction of the contains and compareDocumentPosition methods. And through parentElement you will need to do a cycle ...... - pepel_xD
    • @pepel_xD, Without it, nothing - Grundy