Having the Javascript Anthology as (only) basic knowledge I have faced an iteration problem with Eventlisteners.

Background: A list of e-cards, the text 'send an e-card' can be clicked, a pop-up appears. Each pop-up menu calls a different php file which is actually a send-to-a friend form for that specific e-card. I use a basic code for the pop-up menu (see below). How can I write a Javascript function that iterates through the ID's instead of using seperate functions? I tried several solutions with for(var i = 0; etc....) and Arrays but couldn't move the DOM a bit!

The HTML code for a list of e-cards:
<ul id="sendacard">
<li><img alt="" src="e-card1.gif" /><a href="e-card.php" id="cardlink">
Send this e-card!</a></li>
<li><img alt="" src="e-card2.gif" /><a href="e-card2.php" id="cardlink">
Send this e-card!</a></li>
etc..
</ul>

The Javascipt code that works (but with all seperate functions, which i know is not particular clean scripting).

addLoadListener(init);
addLoadListener(init2);
addLoadListener(init3);
addLoadListener(init4);
addLoadListener(init5);
addLoadListener(init6);

function init()
{
document.getElementById('cardlink').onclick = function()
{
var cardform = makePopup(this.href, 640, 550, 'scroll');

return cardform.closed;
};
}
function init2()
{
document.getElementById('cardlink2').onclick = function()
{
var cardform = makePopup(this.href, 640, 550, 'scroll');

return cardform.closed;
};
}

......and so on for init3 until 6....

function makePopup(url, width, height, overflow)
{
if (width > 640) { width = 640; }
if (height > 550) { height = 550; }

if (overflow == '' || !/^(scroll|resize|both)$/.test(overflow))
{
overflow = 'both';
}

var win = window.open(url, '',
'width=' + width + ',height=' + height
+ ',scrollbars=' + (/^(scroll|both)$/.test(overflow) ? 'yes' : 'no')
+ ',resizable=' + (/^(resize|both)$/.test(overflow) ? 'yes' : 'no')
+ ',status=yes,toolbar=no,menubar=no,location=no'
);

return win;
}

function addLoadListener(fn).... etc....