title: How to insert HTML inside template literal strings?
body: <p>In React, I want to be able to use style words within a string which is defined in a variable using template literals.
  For that I am making use of a  to just style that word.
  I am getting HTMLIntrinsic usage error.</p>
  
  <p>Note- Solutions given in SO to questions related to this does not solve the issue I have. Pls check the code.</p>
  
  <p>How to circumvent this problem</p>
  
  <p>Tried using dangerouslyinsertHTML, but not a recommended solution.</p>
  
  <pre><code>    //Actual code
      const temperature = "22";
      const list = {
         item: `The temperature is ${temperature}`
      }
  
      //To style it-
      const temperature = "22";
      const list = {
         item: `The temperature is &lt;span style={{color:'red'}}&gt;${temperature}&lt;/span&gt;`
      }
  
      //And the above list.item is inserted inside JSX like -
      return (
        &lt;div&gt;{list.item}&lt;/div&gt;
      )
  </code></pre>
  
  <p>The temperature(22) needs to be styled.</p>