Why does only the first filter for “show more” work?

On the webshop for my internship I’m trying to resolve a filter problem.
On each page, only the first filter works when you press “show more”. On all other filters nothing happens once you press “show more”.

This is the code responsible:

function _toConsumableArray(e) {
    if (Array.isArray(e)) {
        for (var o = 0, s = Array(e.length); o < e.length; o++) s[o] = e[o];
        return s;
    }
    return Array.from(e);
}
function showLessMore(e) {
    var o = e.target;
    if (qty.hasClass("js-hook__amshopby-more")) {
        e.preventDefault();
        var s = o.parentNode.parentNode,
            a = s.querySelectorAll(".js-hook__amshopby-item");
        if (a.length) {
            for (var r = [].concat(_toConsumableArray(a)), t = 0; t < r.length; t++) {
                var l = r[t];
                "none" == l.style.display && (l.classList.add("filter--visible"), (l.style.display = "block"));
            }
            (o.style.display = "none !important"), (s.querySelector(".js-hook__amshopby-less").style.display = "block !important");
        }
    }
    if (qty.hasClass(o, "js-hook__amshopby-less")) {
        e.preventDefault();
        var n = o.parentNode.parentNode,
            y = n.parentNode.parentNode.querySelectorAll(".js-hook__amshopby-item.filter--visible");
        if (y.length) {
            for (var i = [].concat(_toConsumableArray(y)), p = 0; p < i.length; p++) {
                var c = i[p];
                c.classList.remove("filter--visible"), (c.style.display = "none");
            }
            (o.style.display = "none !important"), (n.querySelector(".js-hook__amshopby-more").style.display = "block !important");
        }
    }
}

Any help would be greatly appreciated!