title: Changing value of variable onclick
body: <p>I am trying to change variable value on click, so that i can send the value via ajax to load data in ascending or descending format.</p>
  
  <p>Here is Javascript part on top of page.</p>
  
  <pre><code>var ascending = '0';
  </code></pre>
  
  <p>Here is HTML Part.</p>
  
  <pre><code>&lt;span onclick="knowFormat(true)"&gt;&lt;input type="checkbox" id="ascending" name="ascending"&gt;&lt;label for="ascending"&gt;&lt;i class="fa fa-sort-alpha-asc"&gt;&lt;/i&gt;&amp;nbsp;Ascending&lt;/label&gt;&lt;/span&gt;
  
  &lt;span onclick="knowFormat(false)"&gt;&lt;input type="checkbox" id="descending" name="ascending"&gt;&lt;label for="descending"&gt;&lt;i class="fa fa-sort-alpha-desc"&gt;&lt;/i&gt;&amp;nbsp;Descending&lt;/label&gt;&lt;/span&gt;
  
  &lt;span&gt;&lt;input type="button" name="sort" onclick="sorting()"&gt;&lt;/span&gt;
  </code></pre>
  
  <p>Here is my CSS :</p>
  
  <pre><code>input { display:none; }
  input:checked ~ label { color:red; }
  </code></pre>
  
  <p>Here is my Javascript just before ajax function and after html, css part:</p>
  
  <pre><code>function knowFormat(ascending) {
      if (ascending) { ascending = '0'; } else { ascending = '1'; }
  }
  </code></pre>
  
  <p>And in my Ajax, Data is always getting sent '0', even after click.</p>
  
  <pre><code>function sorting() {
  alert(ascending);
      jQuery.ajax({
          url : 'ajax/file.php',
          type : 'POST',
          data : 'ascending='+ascending,
          success : function(s) {
              alert(s);
          }
      });
  }
  </code></pre>
  
  <p>Even after clicking <code>sorting</code>, The <code>alert</code> button is always <code>0</code>.</p>