title: JS Change CSS line-height based on number of characters
body: <p>I have a ul list that is dynamically generated upon page load via JavaScript.
  The code that is generated can be seen here (with irrelevant items removed):</p>
  
  <pre><code>&lt;ul class="tweet_list"&gt;&lt;li class="tweet_first tweet_odd"&gt;&lt;/li&gt;&lt;/ul&gt;
  </code></pre>
  
  <p>CSS:</p>
  
  <pre><code>​ul.tweet_list li {
      height: 55px;
      line-height: 55px;
      overflow: hidden;
      padding: 0.5em !important;
      vertical-align:middle;
  }​
  </code></pre>
  
  <p>I'm trying to change the CSS <code>line-height</code> property based on the number of words in the Tweet (if over 9 words, I want the line height to change from 55px to 24px). Here is my JS:</p>
  
  <pre><code>$(function(){
      var $tweet = $(".tweet_first");
      var $numWords = $tweet.text().split(" ").length;
      if (($numWords &gt;= 1) &amp;&amp; ($numWords &lt; 10)) {
          $tweet.css("line-height", "55px");
      }
      else {
          $tweet.css("line-height", "24px");
      }    
  });
  </code></pre>
  
  <p>Here's a screenshot of the widget <a href="http://justpaste.it/twitter-widget" rel="nofollow">http://justpaste.it/twitter-widget</a> </p>
  
  <p>EDIT: My code isn't working. For some reason nothing I have above will change the line-height dynamically unless I go into my styles.css file and actually change the line height. HOW CAN I CALL IN MY JS THE <code>ul.tweet_list li</code> AND APPLY THE <code>line-height</code> property directly to it?</p>
  
  <p>UPDATE: If someone can just tell me how to dynamically change the CSS portion, I can figure out how to detect the number of characters in the tweet. So, using Javascript, how can I change this:</p>
  
  <pre><code>​ul.tweet_list li {line-height: 55px; }​
  </code></pre>
  
  <p>to this:</p>
  
  <p>​<code>ul.tweet_list li {line-height: 24px; }​</code></p>
  
  <p>UPDATE 2:
  Code that calls the tweet:</p>
  
  <pre><code>jQuery(function($){
        $(".tweeter_widget").tweet({
          join_text: "auto",
          username: "twitter_username",
          avatar_size: null,
          count: 1,
          auto_join_text_default: "",
          auto_join_text_ed: "",
          auto_join_text_ing: "",
          auto_join_text_reply: "",
          auto_join_text_url: "",
          loading_text: "loading tweets..."
        });
      }); 
  </code></pre>