So currently this function works on desktop but when I test it on mobile I get "undefined." I checked to see if activeElement is compatible on iPhone safari and it says it works there so I'm currently lost. Any fixes or alternatives?

This is the button that is selected.

<input type='button' id='slogan-button' onclick='changeSlogan()' value='Junior Varsity'>

This is the function to make it work.

<script>
    function changeSlogan() {
        const activeSlogan = document.activeElement.value;
      document.getElementById('slogan-input').value = activeSlogan;
      document.getElementById('slogan-display').innerHTML = activeSlogan;
    }
</script>

This is supposed to allow a slogan to be selected and the value of the slogan is added into a input, I get the equal value of the selected slogan only on desktop.