如何删除空标签的父级 jquery

Question

I have multiple data which i inserted into an html tag. Some of the tags are empty while some are filled with details. What i want is how do i remove the parent of the ones that are empty, this is my code

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();
    }
}

Please What am i doing wrong

Answer 1

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

This code will remove those elements of class .col-12 that contain an empty h6 element.

Answer 2

You're not iterating using the css selector.

Try this function:

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