I'm trying to reuse fragments like this, but the event listener only works once and is no longer there when the fragment gets reused:

<https://codepen.io/dvtan/pen/dyyGVKm>

```
let $home = $(`
<div>
  <h1>Home page</h1>
  <button class="btn btn-primary">Go to another page</button>
</div>`);

let $another = $(`
<div>
  <h1>Another page</h1>
  <button class="btn btn-primary">Go back</button>
</div>`);

$("body").html($home);

$home.find('.btn').on('click', () => {
  $("body").html($another);
});

$another.find('.btn').on('click', () => {
  $("body").html($home);
});

```

I thought that intuitively, the event listeners should follow the fragment around, so it doesn't make sense that they would just disappear like this. Why is it happening, and what's the solution to this?