Get Link Href And Apply It To Another Link Jquery

I have a set of DIVs, each contains an image with an empty anchor tag wrapped around it Image is here I then have a 'Continue reading' link just befo

Solution 1:

It is possible, but it is not a good idea. Links created with js are not visible for google crawers. The right way of doing this is creating a real link instead of "#".

Do the things right not interesting ;).

Solution 2:

based on your HTML, you can do this:

​$(function(){
    $('.card-prod').each(function(){                         //for each itemvar theLink = $('a[href^="?p"]',this).attr('href');  //get the link
        $('a.cardclick',this).attr({'href':theLink});        //set to img link
    });
})​​

Solution 3:

You can loop through the "continue reading" links and copy their href, perhaps like this:

​$(​"div.card-prod a:contains('Continue reading')")​​​​​​​​​​​​​​​​​​​​​​​​​​.each(function() {
    var $this = $(this);
    $this.closest("div.card-prod")
         .find("a.cardclick")
         .attr("href", $this.attr("href"));
});​

Updated Demo: http://jsfiddle.net/2hu66/3/

The :contains selector that I used above is not going to be the most efficient way to do it, but it works. If it were my html I'd probably give those "continue reading" anchor elements a common class and select on that. Or you could select the "meta-nav" spans and then take their parent. (Lots of options, really.)

Solution 4:

$('.card-prod').each(function() {
    var cr = $(this).find('a:last');
    $(this).find('.cardclick').attr('href', cr.attr('href'));
});

example Fiddle: http://jsfiddle.net/2hu66/4/