Get the height of a div jquery

Question

I am trying to make a navigation, that sets the "active" class to links whenever it scrolls a specified ammount of pixels. But there is a div on the page, that get's its size based on user interaction.

This is the code for setting the active class.

$(function() {
//caches a jQuery object containing the header element
    var header = $(".active");
$(window).scroll(function() {
    var scroll = $(window).scrollTop();

    if (scroll >=760) {
        header.removeClass('active').addClass("active1");
    } 
    else { header.removeClass('active1').addClass('active');}
});

    var header1 = $("#work");
$(window).scroll(function() {
    var scroll = $(window).scrollTop();

    if (scroll >= 759  && scroll < 780) {
        header1.removeClass('#work').addClass("active");
    } else {
        header1.removeClass("active").addClass('#work');
    }
});

var header2 = $("#about");
$(window).scroll(function() {
    var scroll = $(window).scrollTop();

    if (scroll > 779 && scroll < 1450) {
        header2.removeClass('#about').addClass("active");
    } else {
        header2.removeClass("active").addClass('#about');
    }
});

var header3 = $("#contact");
$(window).scroll(function() {
    var scroll = $(window).scrollTop();

    if (scroll > 1449) {
        header3.removeClass('#contact').addClass("active");
    } else {
        header3.removeClass("active").addClass('#contact');
    }
});
});

How do I get the height of a div which has it's class set as auto, and then apply it in the code above ?

EDIT: I tried the $('#ID').height(); but it gets the height when the website is loaded, and it doesn't work after any user interacts with the div.

Answer 1

In basically get the height of the DIV

$('#ID').height();

it returns height.

Answer 2

I guess this is what you are looking for

Sample DEMO

if($("#ID").offset().top < $(window).scrollTop() + $(window).outerHeight())

If you create a fiddle possibly can do the same for you

Hope this helps, Thank you