the for loop isn’t looping on the code of the DOM [duplicate]

let myDiv = document.createElement("div");
let myHeading = document.createElement("h3");
let myParagraph = document.createElement("p");

let myHeadingText = document.createTextNode("Name of  product");
let myParagraphText = document.createTextNode("Description of product");
myDiv.className = "product"; 
for (let i = 1; i < 11; i++) {
    document.body.appendChild(myDiv);
    
    // Add heading text
    myHeading.appendChild(myHeadingText + i);
    
    // Add heading to the main Div
    myDiv.appendChild(myHeading);
    
    // Add paragraph text
    myParagraph.appendChild(myParagraphText + i);
    
    // Add paragraph to the main Div
    myDiv.appendChild(myParagraph);  
    
}