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
109 views
in Web Development by 2 9 19

I hava a list of URLs structured in UL and LI tags, and I want to delete a specific link that contains for example this link www.debug.to using JavaScript or Jquery, unforthunatly I don't have any class or ID to can delete it, so How can I delete a list item based on hyperlink or the displayed text using JS or JQuery?

<div class="URL-links">
<ul>
<li> 
<a href=www.debug.to>deBUG</a>
</li>

<li>
<a href=www.example.com>example</a>
</li>

</ul>
</div>

 


1 Answer

0 like 0 dislike
by 2 9 19
edited by

Delete a specific list item in JavaScript

To delete a specific list item in JavaScript, you can use querySelector() method to return the div that contains that list, then loop over all the li elements in that div and check if the a tag contains the text "deBUG" if so delete it.

var listDiv = document.querySelector('.URL-links');
var listItems = listDiv.querySelector('li');

listItems.forEach( item => {
 var a = item.querySelector('a');
 if ( a.innerText == "deBUG"){
    item.remove();
   }
});

or you can delete the link by it hypertext reference by changing the if condition to:

if ( a.href == "www.debug.to") {
   item.remove();
 }

This might also be done with jquery:

$(‘.URL-links’).find(‘li’).each( function () { if($(this).find(‘a[href*=“debug”]’).length > 0 ) $(this).remove();  });
If you don’t ask, the answer is always NO!
...