title: Is it possible in css to add additional classes to an element with a specific class name?
body: <p>Assume that I am using the following icon in multiple places in my code to represent delete icon:</p>
  
  <pre><code>&lt;i class="fas fa-trash-alt"&gt;&lt;/i&gt;
  </code></pre>
  
  <p>If after a while I decide to change the icon to something else like:</p>
  
  <pre><code>&lt;i class="fas fa-eraser"&gt;&lt;/i&gt;
  </code></pre>
  
  <p>I have to go and find all the instances of the first icon and change the class name to <code>fas fa-eraser</code> which may be painful if the source code is huge.</p>
  
  <p>What I like to do is to have a class name like <code>delete-icon</code> and add it to every delete icon element that I have like:</p>
  
  <pre><code>&lt;i class="delete-icon"&gt;&lt;/i&gt;
  </code></pre>
  
  <p>and then somehow in my css styles, have a rule like:</p>
  
  <pre><code>.delete-icon {
      ?....[add fas]
      ?....[add fa-eraser]
  }
  </code></pre>
  
  <p>Is it possible to have such rule in css?</p>