Welcome to deBUG.to Community where you can ask questions and receive answers from Microsoft MVPs and other experts in our community.
0 like 0 dislike
5.8k views
in Web Development by 42 68 83

I'm trying to use the JQuery to find and remove a specific <li> that has <a> tag with a blank URL in the URL as below

<ul class="list">
    <li>
        <a href="#">1</a>
    </li>
    <li>
        <a href="https://debug.to">2</a>
    </li>
    <li>
        <a href="#">3</a>
    </li>
    <li>
        <a href="https://debug.to">4</a>
    </li>
</ul>

I tried the following jquery, but it did not work.

$('.ul li:href"#"').remove()

How to Find and Remove <li> which doesn't have a link in <ul> using jQuery?


1 Answer

1 like 0 dislike
by 42 68 83
 
Best answer

How to Find and Remove li in ul using JQuery?

  1. Find all li in <ul> by using class name of the <ul>, then remove all <li>:

    $('ul.list li').remove()
    
  2. Find li that has <a> tag by class name of the <ul>, then remove <li>:

    $('ul.list li:has(a)').remove()
    
  3. Find li that has <a> tag and href attribute like #, or any url like debug.to:

     $('ul.list li:has(a[href$=""])').remove()
     $('ul.list li:has(a[href$="debug.to"])').remove()

In case, you are using <div> you can use this code $('div.mylist a[href=""]').hide();

If you don’t ask, the answer is always NO!
...