Changin href value with jQuery

Question

I have the following test html:

<div class="resultsFooter">
    <ul id="ResultFooter">
        <li id="Preferences">
            <a title="Preferences" id="PreferenceLink" href="http://google.com">Preferences</a>
        </li>
        <li id="Advanced">
            <a title="Advanced" id="AdvancedLink" href="http://ask.com">Advanced</a>
        </li>
    </ul>
</div>

I am trying to change the href value of the second a link from "http://ask.com" to "http://bing.com" using jquery. I have the below jquery but it does not seem to do trick, I am missing something in the selector:

$(document).ready(function() {

$('a#AdvancedLink').attr('href', 'http://www.bing.com');

});

Any suggestion on this would be helpful.

Thanks in advance.

Just a note, no need to put the tag name before the id of your element. Since IDs are always unique it is unnecessary. — John Conde, Feb 25 '14 at 13:54
Cant be very simple selector like `$('#AdvancedLink')`, since ids are unique — Murali Murugesan, Feb 25 '14 at 13:55
Maybe a problem due to your jQuery version. Did you try prop('href','http/bing.com') instead of attr(...) ? — phron, Feb 25 '14 at 13:58
http://stackoverflow.com/questions/179713/how-to-change-the-href-for-a-hyperlink-using-jquery — Silwest, Feb 25 '14 at 14:03
@John Conde - I did try this out on jsfiddle before and could have swore it was not working. But thanks for checking, have clicked your jsfiddle link and it works. — Dev P, Feb 25 '14 at 15:40

score 2 · Accepted Answer · answered Feb 25 '14 at 13:55

2

Your original code works fine, however you can remove the a from the selector since the ID should be unique:

$(document).ready(function() {
     $('#AdvancedLink').attr('href', 'http://www.bing.com');
});

http://jsfiddle.net/S2NkH/

If you inspect the markup in the JSFiddle, you can see that Advanced has the href value set to bing.com

answered Feb 25 '14 at 13:55

Darren

68,902
24
138
144

What if the same JavaScript file was included on two pages with `#AdvancedLink` elements, but only one of them was an `a` element? :) (Wasn't me who downvoted, in case you're wondering). – James Donnelly Feb 25 '14 at 13:59
@JamesDonnelly - I would question the developer who named the element `AdvancedLink` if it was not referring to anchor/`hyperlink` element. – Darren Feb 25 '14 at 14:01

score 0 · Answer 2 · answered Feb 25 '14 at 13:56

0

its being an id(unique) you can directly refer it only by that id

$(document).ready(function() {

$('#AdvancedLink').attr('href', 'http://www.bing.com');

});

answered Feb 25 '14 at 13:56

Anoop Joshi P

25,373
8
32
53

Changin href value with jQuery

2 Answers2