How to write an if check in jQuery?

Question

JavaScript

Good day
Please help me understand and I apologize for the heresy in the example below.

You need to check if div.star-rating does NOT have nested elements, then you need to add div.empty to div.star-rating-wrap

If div.star-rating HAS nested elements then do nothing!

The code below doesn't work as expected, it adds the div.empty but removes the div.star-rating if there is one.
Thank you!

$('div.star-rating').has(function() {
    if($('div.star-rating-wrap:empty')) {
        $('div.star-rating-wrap').html('<div class="empty"></div>');
    }else{
        return false;
    }
});

Answer 1

$('.star-rating-wrap').has('.star-rating:empty')
   .append('<div class="empty" />');

Answer 2

if ($('div.star-rating').is(":empty")) {
            $('div.star-rating-wrap').append(
                $("<div/>").addClass('empty')
            );
        };

Answer 3

if (!$('.star-rating').is(':empty')) {
    $('div.star-rating-wrap').append('<div class="empty"></div>');
}

Something like this?
You have a strange approach, of course, why add an empty div, it’s not easier to add a class from which it’s easier to work with CSS and not clog the markup with an empty div.

Answer 4

html of this question
I.e. in this case div.empty should NOT be added as div.star-rating-wrap contains div.star-rating

<div class="star-rating-wrap">
    <div class="star-rating">
        <span>1111</span>
    </div>
    <div class="empty"></div>
</div>