Jquery refuses to select an element using the correct syntax

Question

Hi i wanted to remove a link and i got this code

$(document).ready(function(){
 $(".features-list a").removeAttr("href");

And is not selecting the element

<ul class="features-list">
<li id="f1"><a href="http://www.somepage.com"Link that stops being a link</a></li>
</ul>

I added the id to try and see if i could do this

 $(".features-list#f1").removeAttr("href");

Is not working, i must add that the rest of the jquery code is being correctly executed, i just can't figure this one out. This is all i tried to remove the link

 $("#f1").removeAttr("href");
 $(".features-list > a").removeAttr("href");
 $(".features-list li ").removeAttr("href");
 $(".features-list").children(a).removeAttr("href");

I even tried

 $(".features-list").Attr("href","#");

But jquery refuses to select it What am i doing wrong?

Answer 1

Your link appears broken (it's missing the closing tag >):

<a href="http://www.somepage.com"Link that stops being a link</a>

It should be:

<a href="http://www.somepage.com"&gt;Link that stops being a link</a>

Also $(".features-list#f1").removeAttr("href"); didn't work because there's no href attribute defined on the li and this li has no class="features-list".

$('#f1 a') selects a link which is inside an element with id="f1" (which is the li in your case). $(".features-list a").removeAttr("href") should also work.

Here's a working example.