title: CSS: Is it possible to override one class with another?
body: <p>I have a template class, that is simply:</p>
  
  <pre><code>.template{
    display: none;    
  }
  </code></pre>
  
  <p>This allows me to create a block with html that I can clone using jQuery and slightly edit to my liking.  However, one of the class I've been assigning to this same element to be cloned, sets: </p>
  
  <pre><code>.Category{
    display:table-row-group;
    //other properties not related to this problem not shown
  }
  </code></pre>
  
  <p>This ends up overriding the template display property, which defeats the whole purpose of making it a template class.</p>
  
  <p>Certainly I can always just add the Category class at the same time as I remove the template class via jQuery after cloning, but it's not ideal because the whole point is that the html should be easy to edit and changes can be made there instead of within jQuery code.</p>
  
  <p>Thoughts?  I'm thinking maybe I can tell display to override other properties or something like that?</p>
  
  <p>Thank you!</p>