Why do script tags mess up html injection [duplicate]

This:

document.body.innerHTML += `
<p>1</p>
<script>
  function test() {}

</script>
<p>2</p>
`

Does not work and the website thinks that the js ends at line 5. Why? please help me fix this