title: Declaring a var in click function in jquery
body: <p>I have the following code:</p>
  
  <pre><code>$("#ca li").click(function(){
      $("#ca li").css('text-decoration','none');
      $(this).css('text-decoration','underline');
      var sec = $(this).html();    
  });
  
  if (sec == 'Africa') {
      var ar = 'this is';
  } else {
      var ar = 'is that';
  }
  $('#co').html(ar);
  </code></pre>
  
  <p>The html:</p>
  
  <pre><code>&lt;ul id='ca'&gt;
      &lt;li&gt;Africa&lt;/li&gt;
      &lt;li&gt;Americas&lt;/li&gt;
      &lt;li&gt;Asia&lt;/li&gt;
      &lt;li&gt;Europe&lt;/li&gt;
      &lt;li&gt;Oceania&lt;li&gt;
  &lt;/ul&gt;
  </code></pre>
  
  <p>The var <code>sec</code> does not change after click. What can I do?</p>