Remove LI in UL using JQuery

Question

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?

Answer 1

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