I have a wordpress page. I have a number of links which go to PayPalObjects. PayPalObjects requires that you put code in the footer of the page with triggers to IDs for the elements which trigger a purchase. eg...
<a id="buysong_4" target="PPDGFrame" title="Click here to buy this song now.">$</a>
...and then in the footer of the page:
<script type="text/javascript">
var embeddedPPFlow1 = new PAYPAL.apps.DGFlow( {trigger : 'buysong_1'});
function MyEmbeddedFlow(embeddedFlow) {
this.embeddedPPObj = embeddedFlow;
this.paymentSuccess = function() {
this.embeddedPPObj.closeFlow();
window.location.href = "http://whatever.com/success/";
};
this.paymentCanceled = function() {
this.embeddedPPObj.closeFlow();
top.location.href = "http://whatever.com/fail/";
};
}
var myEmbeddedPaymentFlow1 = new MyEmbeddedFlow(embeddedPPFlow1);
</script>
Now, since I have dozens of such links, I wanted to avoid hard coding these ids into the content. eg...
<a class="buysong" target="PPDGFrame" title="Click here to buy this song now.">$</a>
So I added the following jQuery:
jQuery('.buysong').each(function(index, element) {
jQuery(this).attr('id', 'buysong_' + (index+1) );
});
The rendered page correctly adds the ID attribute to each link, BUT the PayPal js does not trigger properly. IOW: I have to 'hardcode' the ids into the page. This makes me think that the jQuery is firing -after- the PayPal script.
So... how do I 'tell' the PayPalObjects script to only execute -after- the jQuery has assigned the IDs? OR... even if I accomplished that, would it -still- not work because assigning the ID attr. dynamically isn't reliable for what I want to do?
TIA,
---JC