How to optimize the code like "this.parentNode.parentNode.parentNode..."?

Question

var topClick = function() {
  child = this.parentNode.parentNode.parentNode.parentNode;
  child.parentNode.removeChild(child);
  var theFirstChild = document.querySelector(".m-ctt .slt");
  data[child.getAttribute("data-id")].rank = 5;
  insertBlogs();
};

As you see, there is a part of my code like this:

this.parentNode.parentNode.parentNode.parentNode;  

Is there another way to optimize the code (without using jQuery)?

Answer 1

You can use a non recursive helper function, for example:

function nthParent(element, n) {
  while(n-- && element)  
    element = element.parentNode;
  return element;
}

Answer 2

You can use recursive helper function, for example:

function getNthParent(elem, n) {
    return n === 0 ? elem : getNthParent(elem.parentNode, n - 1);
}

var child = getNthParent(someElement, 4);