JSFiddle - React, Tailwind, and code Playground

HTML

Editable: <input id="degInputE" type="text" style="text-align:right;">&deg;<br />
Locked: <input id="degInputL" type="text" style="text-align:right;" disabled>&deg;
<p>Text: <span id="degText"></span>&deg;</p>

JavaScript

document.getElementById("degInputE").value = "360\xB0";
document.getElementById("degInputL").value = "360\xB0";
document.getElementById("degText").innerHTML = "360\xB0";