Loop through li's, find parent href of image in same li and append new href to that li - for each - jQuery

Question

I have a form that generates li's with different content via Ajax. Meaning that the markup in a template just references the content of li one time.

A button that I have placed within the li tag needs to have the href value of that of the image within the same li tag.

My code I have written so far finds only the first li img's href, then assigns that as the href of ALL li's.

I need for them to have the href of their relative img.

Markup:

<li>
    <form name="form<venda_ref>" action="<venda_codehttp>" method="get" id="addproduct<venda_ref>form">
        <venda_inventory ref=<venda_ref>,temp=searchInvt,displayunpublished=1></form>
    <div class="CTA_btn_iCAT"><a href="" title="<venda_text id=site.link.title.more.invt>"><venda_text id=site.link.more></a>
    </div>
</li>

HTML Output: --> http://jsfiddle.net/hslincoln/3pR9y/4/

jQuery used to reassign hrefs of buttons:

jQuery(document).ready(function () {
var iCat_href = jQuery('div.prods ul.prodsGrid li form a').attr('href');
jQuery('.CTA_btn_iCAT a').attr('href', iCat_href);

Any help would be hugely appreciated!

EDIT: Link to the test environment itself:

http://jmldirect.uat.venda.com/uk/health-and-beauty/belvia-range/icat/6belvia

Answer 1

$('div.prods ul.prodsGrid li').each(function(){
    var self = $(this);
    $('.CTA_btn_iCAT a', self).attr('href', $('form a', self).attr('href'));
});

Answer 2

Try this

jQuery(document).ready(function () {
    jQuery('li form a').each(function(){
      var iCat_href=$(this).attr('href');  
      $(this).closest('.CTA_btn_iCAT a').attr('href', iCat_href);
    });

});

Answer 3

jQuery(document).ready(function () {
    var $anchors = jQuery('div.prods ul.prodsGrid li form a');
    jQuery('.CTA_btn_iCAT a').each(function (i, el){
        $(el).attr('href', $anchors.eq(i).attr('href')); 
    });
});