Moving the DOM tree to display parentNode information

Question

I think this should be an easy problem, but alas, I'm stuck. I'm trying to make sure that every time you click on a cell in a table (or anywhere), it displays the parentNode of each element, essentially traversing the DOM tree. I decided that I would need to use elem.parentNode, but I was stuck on the passing part. Any gurus who can help me would be very grateful.

Answer 1

var element; //your clicked element while(element.parentNode) { //display, log or do what you want with element element = element.parentNode; } 

Answer 2

 var tables = document.getElementsByTagName('table'); for (var i=0,len=tables.length;i<len;++i){ tables[i].onclick = function(evt){ if (!evt) evt = window.event; var element = evt.target || evt.srcElement; while (element){ console.log(element); element = element.parentNode; } }; } 

If you really want to click on any item everywhere, simply:

 document.body.onclick = function(evt){ if (!evt) evt = window.event; var element = evt.target || evt.srcElement; while (element){ console.log(element); element = element.parentNode; } };