Activate waypoint on top and bottom of div - jQuery -

i'm trying activate waypoint when user scrolls in top , bottom of same div. changes active state on navigation element. know default top of div how do both?

$('#1').waypoint(function() {     $(".desktop-menu ul li").children().removeclass("active"); $(".desktop-menu ul li ul li").children().removeclass("active");     $("#chapt-1").addclass("active");  }, { offset: 0 }); 

append element id="#1-bottom" right after id="#1" element , declare waypoint on too.

then, scrolling top bottom trig #1 waypoint first , scrolling bottom top trig #1-bottom waypoint first.

html

<div id="#1">[...]</div> <div id="#1-bottom"></div> 

jquery

$('#1').waypoint(function () { [top bottom logic] }); $('#1-bottom').waypoint(function () { [bottom top logic] });