JSFiddle - React, Tailwind, and code Playground

HTML

<div id="div1"></div>
<div id="div2">div2</div>

CSS

#div1{
    height:20px
}

JavaScript

alert('div1:'+getRealHeight($('#div1'))+' ; div2:'+getRealHeight($('#div2')));

function getRealHeight(element){
    var height=0;
    if (element.children().length>0){
        var temp = $('<div></div>');
        temp.append(element.children());
        height = element.height();
        element.append(temp.children());
    } else {
        var html=element.html();
        element.html('');
        height = element.height();
        element.html(html);
    }
    return height;
}