Lemme, ближайший блок к клику дубль 2
<!DOCTYPE HTML>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
</head>
<body>
<style>
.container {
padding: 50px 0;
display: flex;
background-color: #fff;
border: 1px solid #999;
}
.block {
height: 50px;
background-color: tomato;
border: 1px solid #333;
}
</style>
<div class="container">
<div class="block" style="width: 35%"></div>
<div class="block" style="width: 45%"></div>
<div class="block" style="width: 20%"></div>
</div>
<script>
window.addEventListener("DOMContentLoaded", function() {
var d = document.querySelector(".container"),
e = d.querySelectorAll(".block"),
c;
d.addEventListener("click", function(b) {
c = [].map.call(e, function(a) {
a = a.getBoundingClientRect();
c = a.left > b.clientX ? a.left : a.right < b.clientX ? a.right : b.clientX;
c -= b.clientX;
a = a.top > b.clientY ? a.top : a.bottom < b.clientY ? a.bottom : b.clientY;
a -= b.clientY;
return Math.sqrt(c * c + a * a)
});
var d = Math.min.apply(null, c);
[].forEach.call(e, function(a, b) {
a.innerHTML = c[b] > d ? "" : "+"
})
})
});
</script>
</body>
</html>