How do I check if an element is higher than itself?

I’m trying to make a collapsible submenu that, when there isn’t enough space to fit all items, will throw overflowing items into a Bootstrap-style dropdown menu.

I’m doing this by checking if the submenu is greater than a certain height. If it’s higher than this set height, it’s considered overflowing and thus need to run it’s function. However, the project I’m working on can’t really have set heights on elements. These might change over time, and it will be a maintenance nightmare to go through all the code if something changes.

So how do I check if an element’s height is higher than its own (I guess ‘initial’) height?

Setting if(menuHeight >= menuHeight) will cause a Maximum call stack size exceeded-error and crash the tab in Chrome.

Example:

var CollapseMenu = {
    init: function(parent) {
        var menu = parent;
        var menuHeight = menu.height(); // Using jQuery here; vanilla JS could also work

        if(menuHeight >= 64) // This is the set height I want to avoid
            // ...
        } else {
            // ...
        }
    }
}

$(function() {
    var submenu = $('.submenu');

    if(submenu.length) {
        CollapseMenu.init($('.submenu ul));
    }

    $(window).resize(function() {
        if(submenu.length) {
            CollapseMenu.init($('.submenu ul));
        }
    });
});

How do I check if an element is higher than itself?