Right now I have the following in my <div>
{<span>#</span>}
{`${totalQuantity}`} <span>₹</span>
{`${totalCost}`}
This outputs #0₹0 ('totalQuantity' & 'totalCost' are variables with value of zero as of now)
However, as you can see, I have 2 span's & 2 template literals because I do not know how to insert the hex code of # & ₹ into template literal. How do I do that? Can I even do that?
Entities are a part of HTML (their long name is "HTML Entity") and so can be treated similar to how you might do .innerHTML = '<div></div>'.
For example,
someElement.innerHTML = `#${totalQuantity} ₹${totalCost}`;
Note that since HTML5 documents are encouraged to be encoded as UTF-8, you can also do the following (though you may have reasons not to):
someElement.innerHTML = `#${totalQuantity} ₹${totalCost}`;