If item has class change css of another

If item has class change css of another

So I have a unordered list as my menu. I have it setup so that whenever I
click a menu item, that menu item then gets the class "active" added to
it, and any other list item with that class has it removed. This part
works fine. Now, I have an arrow that is absolute position and i simply
want to change the "top" style depending on what class has the "active"
class. It is only checking when the site initially loads, so won't change
placement when another list item gets the "active" class. NOTE: The
".active-item" is the arrow.
$(document).ready(function() {
$('.nav .nav-items li').click(function () {
$('.nav .nav-items li').removeClass('active');
$(this).addClass('active');
});
});
if ($('.nav .nav-items .nav-dash').hasClass('active')) {
$('.nav .nav-items .active-item').removeAttr('style');
$('.nav .nav-items .active-item').css('top', '30px');
};
if ($('.nav .nav-items .nav-sales').hasClass('active')) {
$('.nav .nav-items .active-item').removeAttr('style');
$('.nav .nav-items .active-item').css('top', '90px');
}; etc...