jQueryで5ちゃんねるの吹き出しのようなユーザービリティを実現したく奮闘しているのですが、結構調べたのですがどうすればいいかまったくわかりません。

画像で言えば >>729
にホバーしたときに吹き出しの要素がbodyにappendされているようでカーソルが要素から離れれば、removeで吹き出しは消えます。ここまでは普通に実装できるのですが、
**吹き出しにカーソルを移したときに吹き出しが消えないようにしたい** ときにflg（フラグ）で制御しようとしたのですが、 **他の要素にカーソルがあたると
.number要素からはマウスが離れる** ことになってしまい吹き出しは消えてしまいます。それが下記のコードです。

他の要素にカーソルが移ると、.number要素からカーソルが離れることになるので、flgはfalseにはならず、そのまま吹き出し要素も消えてしまいます。

5ちゃんねるの吹き出しようなユーザビリティーを実現したいです。ご教授のほどよろしくお願いします。

[![画像の説明をここに入力](https://i.stack.imgur.com/m1j3C.png)](https://i.stack.imgur.com/m1j3C.png)

```

    let flg
    $('.number').hover(
        function() {
            let insertcontent = ''
            $('body').append(insertcontent)
            $('.fukidashi').hover(
                function() {
                    flg = false
                },
                function() {
    
                }
            )
        },
        function() {
            if (flg == true) {
                $('.insertcontent').remove()
            }
        }
    )
    
```
CC BY-SA 4.0
2023-01-13T09:24:59.400
93322
2023-01-13T12:32:51.113
2023-01-13T12:32:51.113
3060
26076
question
jquery
jQueryでホバー中に別の要素にホバーしたい (5ちゃんねるの吹き出しのユーザービリティーをjQueryで実現したい)