Phani Phani - 1 year ago 85
Javascript Question

disable or change href for an anchor tag using jQuery

I have HTML something like this:

<div id="StoreLocatorPlaceHoler_ctl07_ctl00_ctl00_pager_ctl00_ctl00_numeric" class="sf_pagerNumeric">
<a href="">1</a>
<a href="">2</a>
<a href="">3</a>
<a href="">4</a>
<a href="">5</a>
<a href="">6</a>
<a href="">7</a>
<a href="">8</a>
<a href="">9</a>
<a href="">10</a>

I have no control over the HTML, I cannot modify it, it is autogenerated by a built in control within CMS.

What I want to do using jQuery is to be able to get the href on each of these anchor tags and modify it, these tags do not have IDs or class associated with them, how do I access those anchor tags in jQuery? This is what I have tried to do so far

jQuery(document).ready(function ($) {

$(".sf_pagerNumeric a").click(function () {

window.location = "";

But the click on the anchor tag doesnt seem to fire this code, it just uses the default href and redirects. Any help would be appreciated.

EDIT: I am not particular about changing it when clicked, I can do it all at once when the document loads, I need a way to access those anchors.


Here is how you change the href for every anchor in your div on load of the document.

    $('.sf_pagerNumeric a').each(function(){
        $(this).attr('href', '#changed');