如何在所有卡片添加opened类后显示按钮？[JavaScript]

我有一组卡片列表，点击卡片时卡片会展开并添加opened类。如何实现当所有卡片都展开后显示一个按钮（按钮或其他动作均可）？

初始HTML结构 #

<ul id='container'>
    <li class='card'></li>
    <li class='card'></li>
    <li class='card'></li>
    <li class='card'></li>
    <li class='card'></li>
</ul>

卡片全展开后的目标结构 #

<ul id='container'>
    <li class='card opened'></li>
    <li class='card opened'></li>
    <li class='card opened'></li>
    <li class='card opened'></li>
    <li class='card opened'></li>
</ul>
<button class='btn-restart'>Restart</button>

遇到的问题 #

我尝试编写代码，想在至少有一个卡片添加opened类时显示按钮，但完全没有效果。我的相关JavaScript代码如下：

function couplesApp() {
    const container = document.getElementById('container');
    const buttonRestart = createRestartButton();

    // 此处省略其他必要代码

    const cards = document.getElementsByClassName('card');
    for (let i = 0; i < cards.length; i++) {
        if (cards[i].classList.contains('opened')) {
            container.append(buttonRestart);
        };
    };

解决方案 #

最终找到可行的代码方案：

document.querySelector('#container').addEventListener('click', () => {
        const cards = document.getElementsByClassName('card');
        for (let i = 0; i < cards.length; i++) {
            if (cards.length === document.querySelectorAll('.card.opened').length){
                container.append(buttonRestart);
            };
        };
    });

感谢Scott Marcus提供的解决方案。

内容的提问来源于stack exchange，提问作者Glub-tubus Wepple