how to create more than one element in the doom with js using a for loop?

Well the result i want to get is my div element should have the same numbers of "p" elements as the array, in order to do this i tried using a for loop but it just create one "p" element, so i didnt work. anyone have idea how to do this? (i'm just learning js).

const diccionario = () => {
    var dama = ["bird:pajaro", "car:carro", "house:csa", "camis"];

    document.getElementById("dic").addEventListener("click", () => {
        var pes = document.createElement("p");
        for(var i = 0;  i < dama.length; i++){
            pes.innerHTML = dama[i];
            document.getElementById("cuadro").appendChild(pes);     
        }
    })
}