pointer events

by Ksenia Polyakova

HTML

<div class="container">
  <div class="one">
  </div>
  <div class="two"></div>
</div>

CSS

.container {
  position: relative;
   width: 300px;
   height: 300px;
   background: aqua;
}

.one {
  position: absolute;
  z-index: 2;
  width: 200px;
   height: 200px;
   background: yellow;
   pointer-events: none;
   
}

.two {
  position: absolute;
  z-index: 3;
  width: 100px;
   height: 100px;
   background: lime;
   pointer-events: none;
}

JavaScript

const divs = document.querySelectorAll('div');
divs.forEach(item => {
	item.addEventListener('click', (e) => console.log(e.target))
})