How to handle certain content when a certain block is clicked (e.target event)?

Question

css

There are several blocks with the same classes. Content blocks have multiple elements that have identical classes as other content blocks. Blocks have one parent. The e.target event is superimposed on the parent and the condition where reacts to the click event is set for the blocks. When you click on the first of the blocks, everything works as it should, when you click on the second block, all changes occur in 1 block and not 2. What to do in this case, I suppose to make some kind of cycle for blocks, but what to do with the contents? How to make it clear what exactly should be worked with the content of block 2?
I did this: this.querySelector(.elements) thinking that it was on which block the click was taken, elements with element classes are taken, but all the same, changes occur on 1 block

<div>
        <div class="block">
                <div class="elements"></div>
                <div class="elements"></div>
                <div class="elements"></div>
        </div>
        <div class="block">
                <div class="elements"></div>
                <div class="elements"></div>
                <div class="elements"></div>
        </div>
        <div class="block">
                <div class="elements"></div>
                <div class="elements"></div>
                <div class="elements"></div>
        </div>
</div>