title: Apply different css for different elements in a same class
body: <p>I would like to know if it is possible to apply different css settings for different elements in the same class.</p>
  
  <p>e.g. I have <code>&lt;li&gt;</code> and I want to apply different fore-colors to the #city, #state and #zipcode but I want to achieve this in the same class.</p>
  
  <pre><code>&lt;li&gt;
   &lt;div id="city"&gt;    &lt;/div&gt;
   &lt;div id="state"&gt; &lt;/div&gt;    
   &lt;div id="zipcode"&gt;&lt;/div&gt;
  &lt;/li&gt;
  </code></pre>
  
  <p>I want something like - </p>
  
  <pre><code>.className{
       here is css for city;
       here is css for state;
       here is css for zipcode;
  }
  </code></pre>