JSFiddle - React, Tailwind, and code Playground

by Trisox

HTML

<div data-track-funnelName="qqq" data-track-funnelStep="zzz" data-track-funnelStepNumber="yyy" data-track-productGroup="www">
    <div data-track-funnelName="abc" data-track-funnelStep="lala" data-track-funnelStepNumber="1" data-track-productGroup="testje">
        <div>
            <div id="test" data-track='{"elementName" : "gezinsSamenstelling"}' data-track-event-click="">1231232</div>
        </div>
    </div>
</div>

JavaScript

function findClosestAttributeValue(element, attr, callback) {
    attr = attr.toLowerCase();
    do {
        if (element.getAttribute(attr) !== null) {
            callback(element, element.getAttribute(attr), attr);
            return element.getAttribute(attr);
        }
    } while (element = element.parentNode)

    return null;
};

document.querySelector('[data-track-event-click]').addEventListener('click', function(event) {
    var a = findClosestAttributeValue(this, 'data-track-funnelName',
        function(element, value, attr) {
            //console.log(element, 'element');
            //console.log(value, 'value');
            //console.log(attr, 'attr');
            console.log(attr + ':' + value);
        })
	console.log(a,'a');

    var b = findClosestAttributeValue(this, 'data-track-funnelStep',
        function(element, value, attr) {
            //console.log(element, 'element');
            //console.log(value, 'value');
            //console.log(attr, 'attr');
            console.log(attr + ':' + value);
        })
	console.log(b,'b');
	
    var c = findClosestAttributeValue(this, 'data-track-funnelStepNumber',
        function(element, value, attr) {
            //console.log(element, 'element');
            //console.log(value, 'value');
            //console.log(attr, 'attr');
            console.log(attr + ':' + value);
        })
	console.log(c,'c');
	
    var d = findClosestAttributeValue(this, 'data-track-productGroup',
        function(element, value, attr) {
            //console.log(element, 'element');
            //console.log(value, 'value');
            //console.log(attr, 'attr');
            console.log(attr + ':' + value);
        })
		
	console.log(d,'d');
})