title: query add two input fields together
body: <p>I have the following code. I want to add two input fields together and output it to the page. I get as far as being able to output what is type in the input field however I can't figure how to add the two fields together and output it. I have it at <a href="http://jsfiddle.net/erick/9Dj3j/3/" rel="nofollow">http://jsfiddle.net/erick/9Dj3j/3/</a></p>
  
  <p>Jquery</p>
  
  <pre><code>$(function() {
      var output_element = $('#output_ele');
      var output_element1 = $('#output_ele1');
  
      $('#the_input_id').keyup(function() {  
          var their_input = $(this).val();
          var firstInput = output_element.text(their_input);
  
  
      });
       $('#the_input_id1').keyup(function() {  
          var their_input1 = $(this).val();
          var firstInput1 = output_element1.text(their_input1);
  
  
      });
  
      var output_total = $('#total');
  
      var total = firstInput + firstInput1;
  
     output_total.text(total);
  
   });
  </code></pre>
  
  <p>HTML</p>
  
  <pre><code>&lt;form method="post"&gt;
      &lt;input type="text" id="the_input_id"&gt;
      &lt;input type="text" id="the_input_id1"&gt;
  &lt;/form&gt;
  &lt;div id="output_ele"&gt;
  
  &lt;/div&gt;
  &lt;div id="output_ele1"&gt;
  
  &lt;/div&gt;
  ​&lt;div id="total"&gt;
  
  &lt;/div&gt;​​​​​​​​​​​​​​​
  </code></pre>