title: how to disable html input fields and buttons using jquery
body: <p>I am having trouble disabling a button. What I am trying to do is to disable the button unless typing some words in the input. The following is my code.</p>
  
  <pre><code>$('.btn.btn-default').click(function(){
      var post = $('input:text').val();
      $('&lt;li&gt;').text(post).prependTo('.posts');
      $('input:text').val("");
      $('.count').text('100');
      $('.btn.btn-default').addClass('disabled');
      });
  
  
  $('input:text').keyup(function(){
      var postLength = (this).val().length;
      var charactersLeft = 100 - postLength;
      $('.count').text(charactersLeft);   
      if (charactersLeft &lt; 0){
      $('.btn.btn-default').addClass('disabled');
      }
      else if (charactersLeft == 100){
          $('.btn.btn-default').addClass('disabled'); 
      }
      else{
          $('.btn.btn-default').removeClass('disabled');
      }
  });
  
  $('.btn.btn-default').addClass('disabled');
  
  };
  </code></pre>
  
  <p>The following is my HTML</p>
  
  <pre><code>&lt;div class= "blank"&gt;
      &lt;input type="text" id="form-control" placeholder="Please Leave Comment Here."/&gt;
      &lt;/div&gt;
  
  
      &lt;div class = "status"&gt;
      &lt;div class= "count"&gt;100&lt;/div&gt;
      &lt;input class="btn btn-default" type="submit" value="Post"&gt;
      &lt;/div&gt;
  
      &lt;ul class="posts"&gt;
      &lt;/ul&gt;
  </code></pre>