Работа удалить множество элементов с в родительском узле?
 

Всем привет, подскажите, пожалуйста как правильно удалить множество элементов с в родительском узле?

<div class="users" data-component="users">
    <form class="users__form" data-users-ref="form">
        <div class="users__element">
            <input class="users__input" type="text" placeholder="Имя" data-users-ref="name" />
            <div className="users__message" data-users-ref="message"></div>
        </div>
        <div class="users__element">
            <!-- <input class="users__input" type="text" placeholder="Тип" data-users-ref="type" /> -->
            <select class="users__select" data-users-ref="type">
                <option value="1">Физическое лицо</option>
                <option value="2">Юридическое лицо</option>
            </select>
        </div>
        <div class="users__element">
            <input class="users__input" type="text" placeholder="Номер потребителя" data-users-ref="user-number" />
            <div className="users__message" data-users-ref="message"></div>
        </div>
        <button class="users__button" type="submit">Создать</button>
    </form>
</div>

Мне нужно удалить все элементы:

<div className="users__message" data-users-ref="message"></div>

darktowerk56c,

document.addEventListener("DOMContentLoaded", () => {
[...document.querySelectorAll('[data-users-ref="message"]')].forEach(item => item.remove())
})

Большое спасибо.