Element types?

Can be anything, so <div id=”, <span id=”, <p id=”, etc

N.B. You need to place the <script> after the HTML element, or call it within say window.onload = function() (the div or whatever tag you’ve used must be before the javascript on the page)

In your html

<div id="my_target_div"></div>

To manipulate text within a block of text you could you span instead of div

In your javascript – Referencing by ID Name

document.getElementById('MyTargetIdName').innerHTML = "<p>Hello</p>";

//or

<script>document.getElementById('MyTargetIdName').innerHTML = "<p>Hello</p>";</script>

In your javascript – Referencing by Class Name

document.getElementsByClassName('MyTargetClassName')[0].style.visibility = "visible" ;
//When you getElementsByClassName an array is retutrned, because there can be more than one element using the same class.

If the text you are inserting has special characters, line breaks, etc

Because you are inserting into javascript, json_encode is the best solution. (Note there are no surrounding quotes, json_encode provides these).

  $ConvertedText = json_encode($MyText);
  $HtmlOutput .= <<<_END
    <style>
      #MyCssId p {
        white-space: pre-line;
      }
    </style>
    <script>
document.querySelector('#MyCssId p').innerHTML= $ConvertedText;
    </script>
_END;

If using jquery

$("#my_target_div").html("<p>Hello</p>");

Note that this will overwrite if you already have content between the div tags