title: How I access input value inside a function when page is load
body: <p>Look at the sample code block below,</p>
  <pre><code>var tax = 0;
  
  function taxCalc () {
    var subtotal  = parseFloat(0);
    if (tax &lt; 0 || tax &gt; 100 || tax == '') {
      tax = 0;
      taxInput = 0;
    } else {
      taxInput = parseFloat(subtot) * (parseFloat(tax) / 100);
    }
  
    $(document).find(&quot;.inline_subtotal&quot;).each(function (i, obj) {
      subtotal = (parseFloat(subtotal) + parseFloat($(this).text())).toFixed(2);
    });
  
    console.log(tax)
  }
  
  $('#taxInput').on('change blur', '#taxInput', function() {
    tax = $(this).val();
    taxCalc(); 
  });
  
  
  $(document).on(&quot;click&quot;, &quot;.remove&quot;, function () {
    $(&quot;#item-row&quot;).remove();
    taxCalc();
  });
  
  &lt;input type=&quot;text&quot; id=&quot;taxInput&quot; name=&quot;taxInput&quot; value=&quot;&quot;&gt;
  </code></pre>
  <p>My problem is I can't get input value into function, when the click event occurs. This is
  happen when the page is loading. but I can get it when input change.</p>
  <p>I tried it as following ways, but none of them work for me.</p>
  <pre><code>$('#taxInput').on('change blur', '#taxInput', function() {
    tax = $(this).val();
    taxCalc(); 
  }).trigger('change'); 
  
  $(document).on(&quot;click&quot;, &quot;.remove&quot;, function () {
    var id = $(this).data(&quot;id&quot;);
    $(&quot;#item-row-&quot;+id).remove();
  
    var timeout = null;
    if (timeout) clearTimeout(timeout)
    timeout = setTimeout(function() {
      taxCalc ();
    }, 10)
  </code></pre>