title: Global variable not not visible outside of if statement JS
body: <p>Struggling to understand why my global variables abundanceone &amp; abunbancetwo will not show in the console outside of the if statements? I can see the values change depending on the if statement logic if I console.log inside the if statement however outside of the if nothing?  I should see an integer between 1-4 for each variable.</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>$('#selector1').change(function() {
    var selector1 = $('#selector1').val()
    if (selector1 % 1 == 0) {
      if (!selector1) {
        $('#ValOne').val('');
        abundanceone = 0;
        console.log (abundanceone);
        return false;
      }
      if (selector1 == 0) {
        $('#ValOne').val('');
        $('#selector1').val('');
        abundanceone = 0;
         console.log (abundanceone);
        return false;
      }
      if (selector1 &gt;= 1 &amp;&amp; selector1 &lt;= 9) {
        $('#ValOne').val(1);
        abundanceone = 1;
        return false;
      }
      if (selector1 &gt;= 10 &amp;&amp; selector1 &lt;= 99) {
        $('#ValOne').val(2);
        abundanceone = 2;
         console.log (abundanceone);
        return false;
      }
      if (selector1 &gt;= 100 &amp;&amp; selector1 &lt;= 999) {
        $('#ValOne').val(3);
        abundanceone = 3;
         console.log (abundanceone);
        return false;
      }
      if (selector1 &gt;= 1000) {
        $('#ValOne').val(4);
        window.abundanceone = 4;
   
        return false;
      }
    } else {
      alert('Please only enter a whole number');
    }
        console.log (abundanceone +99);
          console.log (window.abundanceone +999999);
  });
  
  $('#selector2').change(function() {
    var selector2 = $('#selector2').val()
    if (selector2 % 1 == 0) {
      if (!selector2) {
        $('#Valtwo').val('');
        abundancetwo = 0;
        return false;
      }
      if (selector2 == 0) {
        $('#Valtwo').val('');
        $('#selector2').val('');
        abundancetwo = 0;
        return false;
      }
      if (selector2 &gt;= 1 &amp;&amp; selector2 &lt;= 9) {
        $('#Valtwo').val(1);
        abundancetwo = 1;
        return false;
      }
      if (selector2 &gt;= 10 &amp;&amp; selector2 &lt;= 99) {
        $('#Valtwo').val(2);
        abundancetwo = 2;
        return false;
      }
      if (selector2 &gt;= 100 &amp;&amp; selector2 &lt;= 999) {
        $('#Valtwo').val(3);
        abundancetwo = 3;
        return false;
      }
      if (selector2 &gt;= 1000) {
        $('#Valtwo').val(4);
        abundancetwo = 4;
        return false;
      }
    } else {
      alert('Please only enter a whole number');
    }
    console.log(abundancetwo);
  });
  
  
  alert(abundanceone + abundancetwo);</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"&gt;&lt;/script&gt;
  &lt;input type="text" name="categorySelect1fromDB" id="ValOne" value="Abundance" class="DropChange" disabled&gt;
  &lt;br&gt;
  &lt;input maxlength="4" type="text" placeholder="Estimated Quantity" id="selector1" name="number_of_taxon1" /&gt;
  &lt;br&gt;
  &lt;br&gt;
  &lt;input type="text" name="categorySelect1fromDB" id="Valtwo" value="Abundance" class="DropChange" disabled&gt;
  &lt;br&gt;
  &lt;input maxlength="4" type="text" placeholder="Estimated Quantity" id="selector2" name="number_of_taxon1" /&gt;</code></pre>
  </div>
  </div>
  </p>