onClick Funktionsaufrufzuweisung frisst String aus Objekt nicht

[Scorp_]

Hallo miteinander!

Der Betreff sollte ja schon ordentlich Verwirrung gestiftet haben. :)
Ich erstelle dynamisch eine Homepage zur Berechnung einiger Werte für ein Spiel, um die Daten besser handzuhaben habe ich Objekte mit den entsprechenden Werten erzeugt. Diese Objekte werden in einem Array gespeichert und nacheinander an eine Funktion, zur Erzeugung der entsprechenden Div-Elemente, übergeben.
In diesem Fall haben die einzelnen Div-Elemente eine onClick Funktion zugewiesen bekommen, die ihr Erscheinungsbild beeinflussen. Da die einzelnen Objekte voneinander abhängig sind und somit auch die Visualisierung der einzelnen Div-Elemente beeinflussen, habe ich die Variable 'requ' eingeführt, die an den onClick-Handler mit übergeben werden muss.
Mein Problem ist, dass der onClick-Handler den Wert von 'requ' nicht kennt und daher von vorne herein nicht ausgeführt wird.

Hier ist der Code:

  
// Objekte  
refining = new skill({  
		name: 'Refining Skill',  
		link: 'RefiningSkill'  
		});  
  
processing = new skill({  
		name: 'Processing Skill',  
		link: 'ProcessingSkill',  
		requ: 'Refining'  
		});  
  
// Konstruktor  
function skill(a){  
	this.name = a.name;  
	this.link = a.link;  
	this.requ = a.requ;  
}  
  
// Array mit Objekten  
var allSkillsArr = new Array(refining, processing);  
  
// Kindfunktion 2  
function handleSkillBoxes(element, box, requ){  
	alert('Wird ausgefuert' + requ); //!! Hier liegt das Problem, fuer refining ist der Rueckgabewert undefined, fuer processing ist requ nicht bekannt und die Funktion wird nicht aufgerufen.  
  
	var div = element.parentNode;  
  
	if(box == 'Box1'){  
		if(div.value < 1){  
			div.value = 1;  
			//...  
		} else if(div.value >= 1){  
			div.value = 0;  
			//...  
		}  
	}  
	else if(box == 'Box2'){  
		if(div.value < 2){  
			div.value = 2;  
			//...  
		} else if(div.value >= 2){  
			div.value = 1;  
			//...  
		}  
	}  
  
	if(requ == 'Refining' && document.getElementById('Refining').value < 2){  
		handleSkillBoxes(document.getElementById('Refining').getElementsByTagName("div")[0], 'Box2', '');  
	}  
}  
  
// Kindfunktion 1  
function createSkillRow(skillName){  
	var div = document.createElement("div");  
	div.id = skillName.link;  
	div.value = 0;  
	document.body.appendChild(div);  
	var parent = div;  
  
	div = document.createElement("div");  
	div.setAttribute('onClick','handleSkillBoxes(this, "Box1", '+skillName.requ+');');  
	parent.appendChild(div);  
  
	div = document.createElement("div");  
	div.setAttribute('onClick','handleSkillBoxes(this, "Box2", '+skillName.requ+');');  
	parent.appendChild(div);  
  
	var span = document.createElement("span");  
	span.innerHTML = skillName.name;  
	parent.appendChild(span);  
}  
  
// Initial Funktionsaufruf  
for(var i = 0; i < allSkillsArr.length; i++){  
	createSkillRow(allSkillsArr[i]);  
}  

Ich habe auch bereits statt div.setAttribute(...), div.onClick = function(){...} versucht, leider ohne Erfolg.

Ich denke die Lösung des Problem ist eine Banalität, leider fällt diese mir aber nicht auf.

Danke euch, dass ihr euch Zeit nehmt. :)