Dynamisches hinzufügen von DOM-Elementen

[DaRealMatrix]

Hallo liebe Community,
ich habe ein kleines logisches Problem mit dem dynamischen hinzufügen von DOM Elementen per JS. Zunächst einmal habe ich den folgenden Codeblock:

function addProductToShoppingWindow(product) {
  var productContainer = $get("product_layer");
  if (productContainer) {
    var productElem = document.createElement("img");
    var newStyleDefinition = "position: absolute; z-index: 10; top: " + product.ImagePosition.Y + "; left: " + product.ImagePosition.X + ";";

// Label1
    productElem.setAttribute("src", "../" + product.ImagePath);
    productElem.setAttribute("height", product.ImageSize.Height);
    productElem.setAttribute("width", product.ImageSize.Width);
    productElem.setAttribute("style", newStyleDefinition);
    // Label2

productContainer.appendChild(productElem);

}
}

Wenn ich nun nacheinander mehrere (gleich aufgebaute) Strukturen an die Funktion übergebe, habe ich beim ersten Aufruf der Funktion an Label1 und Label2 den (korrekten) Wert "position: absolute; z-index: 10; top: Ypx; left: Xpx;" stehen. Sobald ich allerdings nun weitere Aufrufe an die Methode (mit weiteren Produkten) mache, steht an der Position von Label1 weiterhin der oben stehende Code in newStyleDefinition, aber nach dem setzen über productElem.setAttribute("style", newStyleDefinition); steht nun in der Styledefinition nur noch "position: absolute; z-index: 10;“. Kann mir einer von euch dieses Phänomen erklären? Ich habe echt keinen Schimmer mehr :(

Vielen Dank im Voraus.

Viele Grüße,
DaRealMatrix