title: How to create a simple calculation in jquery
body: <p>I'm new to jQuery, this will become very apparent.</p>
  
  <p>I'm trying to basically learn jquery by applying it to small ideas.</p>
  
  <p>In this case it's the Z-score formula in statistics.</p>
  
  <p>z = x-mu/sigma</p>
  
  <p>Here is how i'm approaching it in my jquery code.</p>
  
  <pre><code>$(document).ready(function() {
  
      var x = $('input[name="xValue"]').val();
      var mu = $('input[name="muValue"]').val();
      var sig = $('input[name="sigmaValue"]').val();
      var total = x - mu / sig;
  
      function calculate() {
          $('.result').html(total);
      }
  });
  </code></pre>
  
  <p>One concept that i have captured is to store your values in variables and then manipulate them that way.</p>
  
  <p>What i'm struggling with is what to do with it next. In this case i want to output the result when an event is fired (onclick).</p>
  
  <p>Here is my markup:</p>
  
  <pre><code>&lt;section class="formula"&gt;
      &lt;div class="z"&gt;&lt;/div&gt;
      &lt;div class="x"&gt;
      &lt;input id="xValue" type="text" name="x" autofocus&gt;
      &lt;/div&gt;
      &lt;div class="mu"&gt;
          &lt;input id="muValue" type="text" name="mu"&gt;
      &lt;/div&gt;
      &lt;div class="sigma"&gt;
          &lt;input id="sigmaValue" type="text" name="sigma"&gt;
      &lt;/div&gt;
      &lt;div class="result"&gt;&lt;/div&gt;
      &lt;button onclick="calculate()"&gt;Calculate&lt;/button&gt;
  &lt;/section&gt;
  </code></pre>