Class does not take effect on modal

[fumeeptc]

I have this cookie accept script fragment where i have link with class

class:
<a href="privacy-policy" class="#info-modal-link">

part of code:

        insert: function() {
            this.element_mask = this.build_viewport_mask();
            var e = this.options.zindex;
            this.element_mask && (e += 1);
            var t = i.createElement("div");
            t.className = "cookieinfo", t.style.position = "fixed", t.style.left = 0, t.style.right = 0, t.style.height = this.options.height, t.style.minHeight = this.options.minHeight, t.style.zIndex = e, t.style.background = this.options.bg, t.style.color = this.options.fg, t.style.lineHeight = t.style.minHeight, t.style.padding = "8px 18px", t.style.fontFamily = this.options.fontFamily, t.style.fontSize = this.options.fontSize, t.style.textAlign = this.options.textAlign, "top" === this.options.position ? t.style.top = 0 : t.style.bottom = 0, t.innerHTML = '<div class="cookieinfo-close" style="float:right;display:block;padding:5px 8px 5px 8px;min-width:100px;margin-left:5px;border-top-left-radius:5px;border-top-right-radius:5px;border-bottom-right-radius:5px;border-bottom-left-radius:5px;">' + this.options.closeText + '</div><span style="display:block;padding:5px 0 5px 0;">' + this.options.message + ' <a href="privacy-policy" class="#info-modal-link">' + this.options.linkmsg + "</a></span>", this.element = t;
            var o = t.getElementsByTagName("a")[0];
            //o.href = o.style.textDecoration = "none", o.style.color = this.options.link;
            var n = t.getElementsByTagName("a")[1];
            //n.href = this.options.scriptinfo, n.style.textDecoration = "none", n.style.display = "none", n.style.color = this.options.link;
            var r = t.getElementsByTagName("div")[0];
            r.style.cursor = "pointer", r.style.color = this.options.divlink, r.style.background = this.options.divlinkbg, r.style.textAlign = "center";
            var a = t.getElementsByTagName("img")[0];

            function c(e, t, i) {
                var o = e.addEventListener ? "addEventListener" : "attachEvent",
                    n = e.addEventListener ? "" : "on";
                e[o](n + t, i, !1)
            }
           // a.src = this.options.tracking, a.style.display = "none";
            var l = this;
            c(r, "click", function() {
                l.agree_and_close()
            }), this.element_mask && (c(this.element_mask, "click", function() {
                l.agree_and_close()
            }), i.body.appendChild(this.element_mask)), this.options.acceptOnScroll && c(window, "scroll", function() {
                l.agree_and_close()
            }), i.body.appendChild(this.element), this.inserted = !0, "fade" === this.options.effect ? (this.element.style.opacity = 0, s.fade_in(this.element)) : this.element.style.opacity = 1
        }

Why modal wont open on click but instead it just redirect to the href?
If i try it with a single button it works.

[m3g4p0p]

Two immediate problems are that #info-modal-link is not a valid class name, and that you don’t call .preventDefault() anywhere in your code (which would prevent following the link). Apart from that there’s not much to tell I’m afraid as your code is uglified and out of context… are you using some 3rd party library for this? If so, you should check the documentation (or post a link here); if not please post your original, human-readable code.

[fumeeptc]

@m3g4p0p

Two immediate problems are that #info-modal-link is not a valid class name, and that you don’t call .preventDefault() anywhere in your code (which would prevent following the link). Apart from that there’s not much to tell I’m afraid as your code is uglified and out of context… are you using some 3rd party library for this? If so, you should check the documentation (or post a link here); if not please post your original, human-readable code

Yeah its a library https://cookieinfoscript.com it just offers link to privacy page but i want it to open in modal!

P.S. I have downloaded their js and host it on my own server

[m3g4p0p]

Well I’d rather not try to modify some minified 3rd-party code… it’s obviously difficult, you won’t get any future updates (without losing your modifications), and it’s questionable whether it’s even allowed here – I mean otherwise they would have published the actual, non-minified source code. (You might want to contact the author at any rate.)

However you can safely add your own event listener; even though the layer is created dynamically, you can listen to click events using event delegation like so:

document.body.addEventListener('click', function (event) {
  if (event.target.matches('.cookieinfo > span > a')) {
    // Prevent following the link
    event.preventDefault()
    // Show a proper modal here...
    window.alert('Cookie info')
  }
})

[fumeeptc]

@m3g4p0p

document.body.addEventListener(‘click’, function (event) {
if (event.target.matches(‘.cookieinfo > span > a’)) {
// Prevent following the link
event.preventDefault()
// Show a proper modal here…
window.alert(‘Cookie info’)
}
})

This did the trick thanks allot