当另一个div为空时隐藏div

Question

I know this question has been asked in other topics but for some reason I can't get this code to work on my WordPress website.

 if ($(".objectA").html().length == 0) { $("#objectB").hide(); } 

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <div class="objectA"></div> <div id="objectB">hide this div</div> 

I really don't understand why #objectB is not hidden on my page. When I check the code with developer tools I can see it's there.

Answer 1

Try replacing:

if ($(".objectA").html().length == 0) {
    $("#objectB").hide();
}

With:

if (!$(".objectA").html()) {
    $("#objectB").hide();
}

Answer 2

try adding document ready function. no need to click, document ready runs after page loads.

$( document ).ready(function() {
   if ($(".objectA").html().length == 0) {
       $("#objectB").hide();
   }
});

Answer 3

After Googling a bit more I found the solution myself.

WordPress doesn't accept just if($ ... It needs jQuery(function ($) { before the function. Like this:

jQuery(function ($) {
    if($(".empty-div").html().length ==0)
    {
    $("#deals-wrapper, .listing-details li.vc_tta-tab:nth-child(n+3):nth-child(-n+3)").hide();
    }
});