title: JavaScript - Why is innerHTML property displaying as text when it contains HTML?
body: <p>I have the following bit of JS code being executed in a ASP.CORE View which is intended to basically set the content of an element on the page.</p>
  
  <pre><code>if (notificationBanner) {
      var bannerText = unescape("@ViewData.GetClient().GetText("$.resetCredentials.step2.otpSendBanner")");
      console.log(bannerText);
      notificationBanner.innerHTML = bannerText;
  }
  </code></pre>
  
  <p>The following is being logged in browser console:</p>
  
  <pre><code>&amp;lt;p&amp;gt;A One Time Password (OTP) has been sent to your mobile number below. Enter the OTP in the field below. &amp;lt;strong&amp;gt;The OTP is valid for 10 minutes&amp;lt;/strong&amp;gt;.&amp;lt;/p&amp;gt;&amp;#xA;
  </code></pre>
  
  <p>And the element ends up like this:</p>
  
  <p><a href="https://i.stack.imgur.com/WtNbC.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/WtNbC.png" alt="enter image description here"></a></p>
  
  <p>However this is not correct, I want the part in <code>&lt;strong&gt;&lt;/strong&gt;</code> to be bold. Why is it adding it as text?</p>