Нажатие в любом месте на странице приводит к тому, что nav с affix-top класса изменится на affix class

Question

У меня есть веб-страница, которую я должен оформить для клиента. Я не могу изменить заголовок, который они создали. Моя навигационная панель - это div с id = "nav" class = "affix-top", и все в порядке, пока я не нажму где-нибудь на странице. Когда я щелкаю в любом месте, класс в моей панели навигации меняется на «affix», если я нажимаю снова, он меняется на «affix-top» и снова отображается.

см. Ниже

//I've added some styles to keep navbar from disappearing when scrolling:
    #nav.affix-top {
        position: relative;
        top: 0px;
    }    
    #nav.affix {
        position: fixed;
        top: 101px;
    }

//It works ok.
//But when I click on the page, or a button or anything the navbar disappears
//behind the header due to the class changing.  I tried this, but it did not
//work.

$(document.body).click( function() {
    $('#nav').removeClass('affix');
    $('#nav').addClass('affix-top');
});

Я ожидаюмоя навигационная панель остается неизменной при нажатии на страницу. Спасибо.