JSFiddle - React, Tailwind, and code Playground

by rbrousla

HTML

<!doctype HTML>
<html>
  <head>
      <meta charset="UTF-8"/>
      <title>JavaScript Temperature Converter</title>
   </head>
   <body>
       <h1>Temperature Conversion</h1>
       <p>
           <input type="text" id="temperature" />
           <input type="button" id="f_to_c" value="F to C" />
           <input type="button" id="c_to_f" value="C to F" />
       </p>
       <p id="result"></p>
   </body>
</html>

JavaScript

var report = function (celsius, fahrenheit) {
    document.getElementById("result").innerHTML = celsius + "\xb0C = " + fahrenheit + "\xb0F";
};

document.getElementById("f_to_c").onclick = function () {
    var f = document.getElementById("temperature").value;
    report( (f - 32) / 1.8, f);
};

document.getElementById("c_to_f").onclick = function () {
    var c = document.getElementById("temperature").value;
    report( c, 1.8 * c + 32);
};