title: html input change background on value not equal 0
body: <p>This question has been asked before, however, after using many of the methods described I cannot get this to work.</p>
  
  <p>I am trying to change the background of a div when a user focuses on an input box AND also when there is text inside, i.e. != 0.  I can get the focus to work, but blur is not functioning correctly.</p>
  
  <p>jQuery:</p>
  
  <pre><code>$('.pI_nameText1').focus( function() {
     $(".nameLights").addClass("lightOverlay");
  });
  $('.pI_nameText1').blur( function() {
     $(".nameLights").removeClass('lightOverlay');
     if ( $(".pI_nameText1").val == '') {
         $('.nameLights').removeClass("lightOverlay");
     }
  });
  </code></pre>
  
  <p>HTML:</p>
  
  <pre><code>&lt;input id="comments" placeholder="Type many lines of texts in here and you will see magic stuff" class="pI_nameText1"&gt;&lt;/input&gt;
  &lt;div class="nameLights"&gt;&lt;/div&gt;
  </code></pre>
  
  <p>Here is a fiddle:<a href="http://jsfiddle.net/3fnzL/" rel="nofollow">http://jsfiddle.net/3fnzL/</a></p>
  
  <p>I believe that the problem may be related to how I have written the if statement...</p>