Imagine this simple html code:

```
<section onclick="dosomething(event)">
    <div slot="header" class="collapse-header">
      <div class="collapse-image"></div>
      <div class="collapse-text-price-container">
        <div class="collapse-text">სასაჩუქრე ბარათი 200 ლარი – ტანსაცმლის მაღაზია ZURA & SHARK</div>
        <div minprice="1200"></div>
      </div>
      <div class="center-item-container">
        <div class="status success-status">წაღებული</div>
      </div>
      <div class="center-item-container">
        <div class="date-text">10 იან, 2018</div>
      </div>
      <div class="center-item-container">
        <iron-icon class="icon" icon="bog:chevron-down"></iron-icon>
      </div>
    </div>
    <div slot="body" class="collapse-body">
      <div>Contrary to popular belief, Lorem Ipsum is not simply random text. It has roots in a piece of classical Latin literature from 45 BC, making it over 2000 years old.</div>
    </div>
  </section>

```

Pay attention to this part of the code : `onclick="dosomething(event)"`. as you see I have many other elements inside outer `<section>` tag. I also have many sections like that, and on click, I want to get the exact section element which was clicked, How can I do that? `event.srcElement` sometimes return element inside this section, not the section itself. So what is the solution? 

My current solution (which I don't like) is that I take property `path` or `composedPath` from `event`, it's array of elements, and I iterate through it until I find element with tag name `section`.