Working on at outside project cause I need a break from the jquery course. Getting a var not defined error

var main = function(){
  $(".btn").click(function(){ /* .val() like.text() for form inputs */
    var post = $(".status-box").val(); /* entered text stored in post */
    $("<li>").text(post).prependTo(".posts"); /*create li + txt + prepend*/ 
    $(".status-box").val(""); /* clear status box */
    $('.counter').text('140'); /* reset counter at btn click */
  });

  $(".status-box").keyup(function(){ /* count at each upstroke */
  var postLength = $(this).val().length; /* char in status-box */
  var charectersLeft = 140 - postLength; /* total - strokes */
  $(".counter").text(charectersLeft); /* display total */
  // this works fine until if statement
  // then I get an error charactersLeft not defined
  // maybe be something else I'm missing
  // cause charactersLeft seems to be working 
  // prior to addition of the if statement
  if(charactersLeft < 0){
      $(".btn").addClass("disabled");
    } else if(charactersLeft === 140){ 
      $(".btn").addClass("disabled");
    } else{
      $(".btn").removeClass("disabled");
    }
  }); /* keyup event */

  // $(".btn").addClass("disabled");

}