There is the following html:

<ul id="Pagination"> <li class="ImagePrev"><?php previous_post_link('<a>%link</a>')?></li> <li class="ImageNext"><?php next_post_link('<a>%link</a>')?></li> </ul>

Each li has its own background and, if there is no link, you need the background to disappear!
My attempt:

 if(("#Pagination a") == 0){ alert("1"); }
  • one
    You probably wanted to write if($("#Pagination a").length == 0) ? - Alexey Shimansky
  • If you mean that the domain under the link is live - you can check it with the img tag for the presence of a picture on another site (this does not mean that the page cannot link to the link), using the onerror event. And so with the help of JS you can check only the syntax of the link. - nick_n_a

2 answers 2

Selector :empty will select li , which have no content. Does this solve the problem?

1) via CSS

https://jsfiddle.net/glebkema/854oopmp/

 /* heart of the matter */ .ImagePrev { background-color: green; } .ImagePrev:empty { background-color: grey; } /* nice look */ #Pagination { display: block; list-style-type: none; margin: 0; overflow: hidden; padding: 0; } #Pagination li { display: block; float: left; height: 100px; margin: 10px; width: 100px; } #Pagination li > a { color: white; display: block; height: 100px; width: 100px; } 
 <ul id="Pagination"> <li class="ImagePrev"></li> <li class="ImagePrev"><a></a></li> <li class="ImagePrev"><a>link</a></li> <li class="ImagePrev"><a href="link">link</a></li> </ul>

2) via jQuery

https://jsfiddle.net/glebkema/hmw21yyr/2/

 $(document).ready(function() { $('.ImagePrev:empty').css('background-color', 'grey'); }); 
 /* heart of the matter */ .ImagePrev { background-color: green; } /* nice look */ #Pagination { display: block; list-style-type: none; margin: 0; overflow: hidden; padding: 0; } #Pagination li { display: block; float: left; height: 100px; margin: 10px; width: 100px; } #Pagination li > a { color: white; display: block; height: 100px; width: 100px; } 
 <ul id="Pagination"> <li class="ImagePrev"></li> <li class="ImagePrev"><a></a></li> <li class="ImagePrev"><a>link</a></li> <li class="ImagePrev"><a href="link">link</a></li> </ul> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>

    Found the answer)

     if($(".ImagePrev").children('a').length === 0){ $(".ImagePrev").hide(); }
    • The first comment from Alexei in your question, a more correct one, I would say, is that you don’t need to call an extra method here - Vasily Barbashev
    • @ Vasily Barbashev, in general, rather, neither my nor this answer is completely correct ....... actually you have to go over all .ImagePrev and hide only certain blocks ..... and it will turn out that everyone will hide .... .. and then in case there are no links everywhere ........ but you need $(".ImagePrev").each(function(){ if ($(this).find('a').length == 0) { $(this).hide(); } }); - Alexey Shimansky
    • @ Alexey Shimansky, yes, this should appear here, by the way, try to write not $(this).find('a') , but $('a', this) , structurally fewer methods are called - Vasily Barbashev
    • @ Vasily Barbashev, there is still the same inside the same find - Grundy