JavaScriptで下からフワッと浮き上がる動作を複数要素に適用したい

前提・実現したいこと

スクロールして、下からフワッと現れる仕組みをjavascriptで作成したいです。
※jqueryは使用しない方向で。

発生している問題・エラーメッセージ

現在下記のコードで動き自体の再現はできています。

HTML

    <ul id="aaa">
        <li class="animation">aaaaaaa</li>
        <li class="animation">aaaaaaa</li>
    </ul>

    <ul id="bbb">
        <li class="animation">aaaaaaa</li>
        <li class="animation">aaaaaaa</li>
    </ul>

CSS

 
#aaa{
	opacity : 0;
	visibility: hidden;
	transition: 1s;
	transform: translateY(30px);
}

#aaa.active{
	opacity: 1;
	visibility: visible;
	transform: translateY(0);
}

#bbb{
	opacity : 0;
	visibility: hidden;
	transition: 1s;
	transform: translateY(30px);
}

#bbb.active{
	opacity: 1;
	visibility: visible;
	transform: translateY(0);
}

    document.addEventListener('scroll', scroll_not_aaa =　() => {
        let rect = document.getElementById('aaa').getBoundingClientRect().top;
        let scroll = window.pageYOffset;
        let offset = rect + scroll;
        let windowHeight = window.innerHeight; 
        if (scroll > offset - windowHeight + 150) {
            document.getElementById('aaa').classList.toggle('active');
            document.removeEventListener('scroll', scroll_not_aaa );
        
        }

    });

ただ、これだと'aaa'の要素にしか反映されないので、'bbb'や他の要素にも適用したく関数にしました。
するとremoveEventListenerが効かなかったり、'bbb'の方は作動しなかったりとで困っています。
調べたところ、アロー関数がある為、removeEventListenerが効かなかったりするのかなと思っていますが、
いろいろ試してもなかなか解決せず。
※removeEventListenerは、浮き上がって表示された後はそのまま表示し続けたい為、イベントを消しています。

下記が関数のコードです。

   const ul_scrollMethod = (ul_boxid) =>{
        document.addEventListener('scroll', scroll_not_aaa =　() => {
        let rect = document.getElementById(ul_boxid).getBoundingClientRect().top;
        let scroll = window.pageYOffset;
        let offset = rect + scroll;
        let windowHeight = window.innerHeight; 
        if (scroll > offset - windowHeight + 150) {
            document.getElementById(ul_boxid).classList.toggle('active');
            document.removeEventListener('scroll', scroll_not_aaa );
        }

    });
    }
    ul_scrollMethod('aaa')
    ul_scrollMethod('bbb')

各要素ごとで各要素の所までスクロールされてくると、下からフワッと浮き上がってくれたらOKなのですが、
プログラミング初心者の為、ご教授いただけますと幸いです。
よろしくお願いいたします。