title: jQuery blur except certain element
body: <p>I've set up a jsFiddle <a href="http://jsfiddle.net/trevanhetzel/GzmrS/2/" rel="nofollow">here</a>, code below.</p>
  
  <p>I just have a textarea that gets a class added to it on focus and on blur it gets removed. The class makes the textarea extend by setting a height css attribute, so when you click the button to submit the form I don't want it to remove the class because it just seems awkward.</p>
  
  <p><strong>HTML</strong></p>
  
  <pre><code>&lt;div class="comment_display"&gt;
      &lt;form&gt;
          &lt;textarea class="addcomment"&gt;&lt;/textarea&gt;
          &lt;input class="tagbtn" type="submit" value="Comment" /&gt;
      &lt;/form&gt;            
  &lt;/div&gt;​
  </code></pre>
  
  <p><strong>CSS</strong></p>
  
  <pre><code>.addcommentOn {
      height: 100px;
  }​
  </code></pre>
  
  <p><strong>Javascript</strong></p>
  
  <pre><code>// Lengthen the Discussion input on click
    $(function lengthenInput() {
      $(".addcomment").focus(function() {
          $(this).addClass("addcommentOn");
      });
  
      $(".addcomment").blur(function() {
          if ($("input.comment").data('clicked') != true) {
              $(this).removeClass("addcommentOn");
          }
      });
    });​
  </code></pre>