 <p>Add all the spans to your HTML, but hide them initially. Then use an <code>if</code> statement to show the one you want.</p> <p><div class="snippet" data-lang="js" data-hide="false"> <div class="snippet-code"> <pre class="snippet-code-js lang-js prettyprint-override"><code>function calculate() { var myBox1 = document.getElementById('box1').value; var myBox2 = document.getElementById('box2').value; var myBox3 = document.getElementById('box3').value; var result = document.getElementById('result'); var divide = (document.getElementById('changeValue').checked ? 35 : 25); var myResult = myBox1 * myBox2 * myBox3 / divide; var links = document.getElementsByClassName("link"); for (var i = 0; i &lt; links.length; i++) { links[i].style.display = "none"; } var linkToShow; if (myResult &lt; 30) { linkToShow = 0; } else if (myResult &lt; 50) { linkToShow = 1; } else if (myResult &lt; 70) { linkToShow = 2; } else { linkToShow = 3; } links[linkToShow].style.display = "inline"; result.value = myResult.toFixed(2) + ' eggs'; }</code></pre> <pre class="snippet-code-css lang-css prettyprint-override"><code>.link { display: none; }</code></pre> <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;input type="text" id="box1" oninput="calculate()" /&gt; &lt;input type="text" id="box2" oninput="calculate()" /&gt; &lt;input type="text" id="box3" oninput="calculate()" /&gt; &lt;input id="result" /&gt; &lt;a class="link" href="link-1"&gt;link-1&lt;/a&gt; &lt;a class="link" href="link-2"&gt;link-2&lt;/a&gt; &lt;a class="link" href="link-3"&gt;link-3&lt;/a&gt; &lt;a class="link" href="link-4"&gt;link-4&lt;/a&gt; &lt;br /&gt; &lt;br /&gt; &lt;br /&gt; &lt;input type="checkbox" name="changeValue" id="changeValue" /&gt; &lt;label for="changeValue"&gt;Divide with 35&lt;/label&gt;</code></pre> </div> </div> </p>