// toogle class that takes in the element, the class we want to toggle and force
//force can be set to or false to set the class to show always
const toggleClass = (element, className, force) => {
        element.classList.toggle(className, force);
    };


// were using this function to hide and show on an element that is clicked only
// this is why current target is passed into the function,
// the second param we are also passing force, but setting to true so 
const toggleSpan = (currentTarget, force = true) => {
        const compareBlock = currentTarget.closest(".compare-block");
        const currentSpan = compareBlock.querySelector("span");
        toggleClass(currentSpan, "show", force);
        if (currentSpan.className.indexOf("show") > -1) {
            currentSpan.setAttribute("aria-hidden", "false");
        } else {
            currentSpan.setAttribute("aria-hidden", "true");
        }
    };


compareBtns.forEach((button) => toggleSpan(button, false));