JSFiddle - React, Tailwind, and code Playground

HTML

<ul>
     <li><span>Elem 1</span></li>
     <li><span>Elem 2</span></li>
     <li><span>Elem 3</span></li>
        <li>
            <span>Elem 4</span>
            <ul>
                <li><span>1</span><span>2</span></li>
            </ul>
        </li>
    </ul>

CSS

span {
    display: block;
    padding: 3px;
}

JavaScript

function getTagName(element) {
    return element.tagName;
}
function clickHandler(event) {
    var target = event.target,
	    breadcrumb = [],
        part = [],
        prev = target,
        temp;

	while (target) {
		if (prev) {
            part.unshift(prev.tagName);
            prev = prev.previousElementSibling;
        } else {
            target = target.parentElement;
            prev = target;
            breadcrumb.unshift(part.join(" + "));
            part = [];
        }
	}
    
	console.log(breadcrumb.join(" > "));
}
                
document.addEventListener('click', clickHandler, false);