Javascript | 'element.style.display' status check doesn't work in 'if gate'?

I want to make a button that changes div display mode and changes innerHTML of button on-click.

Display of content2 is initially set to 'none'.

My code doesn't currently change anything.

Thanks for the help.

Javascript

let button2 = document.getElementById('more-button-2');
let content2 = document.getElementById('more2');

   button2.onclick = function() {
        if (content2.style.display === 'none') {
            content2.style.display = 'block'; 
            button2.innerHTML = 'See less'; 
        } else if (content2.style.display === 'block') {
            content2.style.display = 'none'; 
            button2.innerHTML = 'See more' 
        } 
    };

HTML

    <div class='column'>
        <div class='column-content'>
            <h2>Two</h2>
            <p>Explanation.</p>
            <div class='more-button' id='more-button-2'>See more</div>
            <p id='more2'>More</p>
        </div>
    </div>