How to hide right chevron in carousel until an option is selected?

Hi,

I used this to obtain something similar in the past. I wasn’t hiding the chevron completely, just enabling/disabling it using existing classes. Feel free to adapt to your needs.

Qualtrics.SurveyEngine.addOnReady(function () {

    var carouselContainer = document.querySelector('#' + this.questionId + ' .CarouselCardContainer');
    var rightChevronButton = document.querySelector('#' + this.questionId + ' .CarouselCardRightContainer .CarouselChevronContainer');
    var inputs = document.querySelectorAll(
        'input[type="radio"][name="QR~' + this.questionId + '~ANSWER"], input[type="checkbox"][name="QR~' + this.questionId + '~ANSWER"]'
    );
    var allCards = carouselContainer.querySelectorAll('.CarouselCard');

    function disableRightChevron() {
        rightChevronButton.setAttribute('disabled', 'true');
        var chevronIcon = rightChevronButton.querySelector('.CarouselChevron');
        if (chevronIcon) {
            chevronIcon.classList.add('Disabled');
        }
    }

    function enableRightChevron() {
        rightChevronButton.removeAttribute('disabled');
        var chevronIcon = rightChevronButton.querySelector('.CarouselChevron');
        if (chevronIcon) {
            chevronIcon.classList.remove('Disabled');
        }
    }

    function isAnyScalePointSelected() {
        for (var i = 0; i < inputs.length; i++) {
            if (inputs[i].checked) {
                return true;
            }
        }
        return false;
    }

    function isLastCardVisible() {
        var lastCard = allCards[allCards.length - 1];
        return !lastCard.classList.contains('NoDisplay');
    }

    function updateChevronState() {
        if (isLastCardVisible()) {
            disableRightChevron();
        } else if (isAnyScalePointSelected()) {
            enableRightChevron();
        } else {
            disableRightChevron();
        }
    }

    for (var i = 0; i < inputs.length; i++) {
        inputs[i].addEventListener('change', function () {
            updateChevronState();
        });
    }

    var observer = new MutationObserver(function (mutations) {
        for (var i = 0; i < mutations.length; i++) {
            if (mutations[i].type === 'attributes' && mutations[i].attributeName === 'class') {
                updateChevronState();
            }
        }
    });

    for (var i = 0; i < allCards.length; i++) {
        observer.observe(allCards[i], {
            attributes: true
        });
    }

    updateChevronState();
});