I notice my event is stop binding after it gets replaced by $.html
const html = `
<div id="container">
<button id="trigger-replace">trigger replace</button>
</div>`
$('#trigger-replace').click(function () {
console.log('trigger-replace')
$('#container').html(html)
});<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="container">
<button id="trigger-replace">trigger replace</button>
</div>if you look at the console.log, the trigger-replace message is not showing.
the fiddle is just an example.
in real world, I'm replacing the whole page which has probably +50 events (click, change, you name it)
please help