The element is moved out of the element after the execution of the aimation animation of js. How to implement it?

The

code is as follows. The requirement is to score a goal and disappear after 5 seconds. Animation is needed when it disappears. After disappearing, you need to clear the dom occupation site, otherwise there will be more and more pages and memory leaks.
setTimeout (function () {

    $(".goalIn .goal-inner[data-id="+ids+"]").animate({
        bottom:"-30px",
        opacity:"0"
      }).remove()
}, 5000);
Jan.12,2022

     $(".goalIn .goal-inner[data-id="+ids+"]").animate({
        bottom:'-30px',
        opacity:'0'
      },1000,function(){
          $(this).remove();
      })

$(".goalIn .goal-inner[data-id="+ids+"]").animate({
        bottom:'-30px',
        opacity:'0'
}, function() {
    // :
    $(this).remove()
})

setTimeout (function () {

$(".goalIn .goal-inner[data-id="+ids+"]").animate({
    bottom:'-30px',
    opacity:'0'
  }).remove()

}, 5000);

does this code mean to move up 30 pixels and then disappear? this seems to be the effect of delaying the playback of the animation for five seconds.
animate has a callback function that can be set, and you can add it to the third parameter
my writing

.
  $(".goalIn .goal-inner[data-id="+ids+"]").animate({
    bottom:'-30px',
    opacity:'0'
  }function(){
    $(".goalIn .goal-inner[data-id="+ids+"]").remove();
  })

animate has a thing called callback function. Just remove it in it

Menu