J query height and java script height gets 0 . Why? : I have a visible div on screen but when i gets its height, it returns always 0. How it is possible? I have tried many j query and JavaScript methods to get hight but it returns 0. This is my div:

    <div class="option-content">
        <div class="row">
            <div class="col-sm-12">
                <div class="dropDownStyling" id="filterDropdowns">
                </div>
    
            </div>
        </div>
    
    //Other contents
    </div>

I have tried following methods to get height:

    var $element = $("#filterDropdowns");
    $element.css("height")
    $element.height()
    $element.innerHeight()
    $element.outerHeight()

    Also tried javascript:
     document.getElementById('filterDropdowns').offsetHeight
     document.getElementById('filterDropdowns').clientHeight

But in all cases, it returns 0,While it returns the width value.Then why height value gets 0?