title: Style text with innerText while still escaping HTML
body: <p>I want to dynamically set the text of a <code>p</code> element with styling, but I do not know how to do this.</p>
  
  <p>Here is my HTML element: <code>&lt;p id="delete-speaker-info-message"&gt; &lt;/p&gt;</code></p>
  
  <p>Here is my current code to set the text: </p>
  
  <pre><code>document.getElementById("delete-speaker-info-message").innerHTML = `Are you sure you want to delete &lt;b&gt;${speakerName}&lt;/b&gt; from &lt;b&gt;${eventName}&lt;/b&gt;? This cannot be undone.`
  </code></pre>
  
  <p>Although the code above works, the speakerName, and eventName values are user inputted and need to be escaped. I know innerText can do this but it also escapes the bold tags. I am sure there is a way to do this but I just could not find it online. Thanks for the help!</p>