JSFiddle - React, Tailwind, and code Playground

HTML

<input class="box" type="text" name="input1" id="input1">
<label for="input1">*2</label>
<div class="box res" id="output1"></div>
<input class="box" type="text" id="input2">
<label for="input2">/2</label>
<div class="box res" id="output2"></div>

CSS

.box {
  height: 20px;
  width: 100px;
  box-sizing: border-box;
  padding-left: 2px;
}
.res {
  border: 1px solid grey;
  background-color: lightgray;
}

JavaScript

document.getElementById("input1").addEventListener('input', e => document.getElementById("output1").innerHTML = e.target.value === '' ? '' : 2 * e.target.value);
document.getElementById("input2").addEventListener('input', e => document.getElementById("output2").innerHTML = e.target.value === '' ? '' : e.target.value / 2);