Target работает не так как нужно

main.onclick = function (e){}

    var parent = document.getElementsByClassName("main")[0];
    
    parent.onclick = function (e){
                
                var e = e || event;
        var target = e.target || e.srcElement;
                alert(target);
        for(var i = 0; i < parent.children.length; i++) {
            if(parent.children[i] == target) return console.log(i);
        }
  }

target=e.target
while (target!=parent&&target=target.parent&&target!=document){}
if(target==document)return true

               var elems = document.querySelectorAll('.in-top');
 
    for (var i = 0; i < elems.length; i++) {
        elems[i].addEventListener("click", nsize, true);
    }
                function nsize(){
 
        this.style.width = '10%';
 
    }

var elems = document.querySelectorAll('.specification > div');
 
    for (var i = 0; i < elems.length; i++) {
        elems[i].addEventListener("click", highlightThis, true);
    }
 
    function highlightThis() {
        this.querySelector("p").style.background = "black";
    }

[].forEach.call(document.querySelectorAll('.specification > div'),function(e){
   e.addEventListner("click",highlightThis,false)// тут я немного отсебятины поставил, а точнее false
})
    function highlightThis() {
        this.querySelector("p").style.background = "black";
    }