how to get the height of a not appended child (div) in JavaScript?

Question

I want to create a DIV using JavaScript, it should contain a text, and it should have a minimum height: if the minimum height is exceeded by the text stretching the DIV, it should have that height instead.

My approach would be to

1. create the element, use appendChild to add it to the container div

    //generate div
    var ldesc = document.createElement('div');
    ldesc.id = `ldesc_${x}`;
    ldesc.style.cssText = `position:absolute;left:calc(28vw + 3px);top:${ldesc_position_top[x]};width:62vw;border:1px solid black;`;
    var someText = document.createTextNode("text text text text   text text text text   text text text text");
    ldesc.appendChild(someText);
   
    //adddiv to container
    container.appendChild(ldesc);
   

2. then using an if function i compare the generated DIV with the auto height to the minimum height. if its smaller than the minimum height, i delete the previous child and make a new one using the minimum height.

    ldesc_height = ldesc.offsetHeight; 
    ldesc_height = parseFloat(ldesc_heights[x]);
   
    //ok
    if (ldesc_height < minimumHeight) {
        container.removeChild(ldesc);
        var ldesc2 = document.createElement('div');
        ldesc2.id = `ldesc2_${x}`;
        ldesc2.style.cssText = `position:absolute;left:calc(28vw + 3px);top:${ldesc_position_top[x]};height:${getlayersize(x)}px;width:62vw;border:1px solid black;`;
            ldesc2.appendChild(someText);
            container.appendChild(ldesc2);
        ldesc_heights[x]=ldesc2.offsetHeight;
   
    } 
   

However, for some reason this approach doesn't work, despite the logic being there. Can someone show me how i could get to where I want?

My idea would be to get the height of the div before i append it to the site, i figure js can't create and delete an element in one instance.