Javascript-форум - Показать/скрыть блок по щелчку на другом блоке

Добрый день. Кто видит проблему. Почему изначально el.nextElementSibling.style.display имеет пустое значение. Из за этого первоначально приходится два раза щелкать по блоку для открытия следующего блока.

<style>
        .news-card__title{
            border: 1px solid #555;
            cursor: pointer;
        }
        .news-card__content {
            display: none;
            border: 1px solid #555;
        }
    </style>

<body>
        <div class="news-card__title" onclick="hid_show(this)">
            <h3>Последние новости (щелкни, чтобы открыть)</h3>
        </div>
        <div class="news-card__content">
            <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Sequi?</p>
            <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Sequi?</p>
            <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Sequi?</p>
        </div>
</body>

function hid_show(el) {
    console.log(el.nextElementSibling.style.display);
   // el.nextElementSibling.style.display = 'none'
    if (el.nextElementSibling.style.display === 'none') {
        el.nextElementSibling.style.display = 'block';

    } else {
        el.nextElementSibling.style.display = 'none';

    }
}