Как удалить родительский элемент пустого тега jquery

Question

У меня есть несколько данных, которые я вставил в тег html. Некоторые теги пусты, а некоторые заполнены деталями. Я хочу, как удалить родительский элемент из пустых, это мой код

HTML

<div class="row order-info">
    <div class="col-12">
        <h6 class="nameDiv">Hello this is nice</h6>
    </div>
    <div class="col-12">
        <h6 class="proId"></h6>
    </div>
    <div class="col-12">
        <h6 class="proP">testing. testing</h6>
    </div>
</div>

JQUERY

removeEmpty();

function removeEmpty() {
    if($(".order-info div h6").text().length < 1) {
        $(this).closest(".col-12").remove();
    }
}

Пожалуйста, что я делаю не так

Answer 1

Вы не выполняете итерацию с использованием селектора css.

Попробуйте эту функцию:

function removeEmpty() {
    $(".order-info div h6").each(function(elem){
        if($(this).html().length < 1) {
            $(this).closest(".col-12").remove();
        }  
    })
}

Answer 2

$('.order-info .col-12').has('h6:empty').remove();

Этот код удалит те элементы класса .col-12, которые содержат пустой элемент h6.