Пытаюсь сделать элемент прозрачным при скроле

Пытался сделать что-то типо этого, но никак...

<style>
.dialott {
  top: 10px;
  z-index: 9999;
  transition:all 0.6s cubic-bezier(0, 0, 0.8, 1.0);
}
.opacity {
  opacity: 0;
}
</style>

<script>
  $(document).ready(function(){
    /* нужно заменить на код блока  Zero выполняющего роль меню */
    var element = 'dialott';
    //Когда начался скролл экрана
    $(window).scroll(function() { 
      var top = $(document).scrollTop();
      //Если перемещение больше 5 px
      if (top >= 1) { 
        //То добавляем к меню наш фон
        $(element).addClass('opacity');
      } else {
        //Если поднялись наверх, то удаляем фон    
        $(element).removeClass('opacity'); 
      }
    });
</script>