title: How do I use CSS transitions when adding elements in Elm?
body: <p>Simple scenario is I have a button that fetches some data from an API and adds the data to a list.</p>
  
  <p>I would like to apply a CSS transition of the opacity property for the newly added item so it fades in as its added to the list.</p>
  
  <p>Usually this is done by having a default CSS class with <code>opacity: 0;</code> and a <code>transition</code> rule. Then after the element is added you apply another CSS class to it with <code>opacity: 1;</code> and you get a fade in effect.</p>
  
  <p>How do you do this with Elm?</p>
  
  <p>This is how list items are added to the view right now,</p>
  
  <p><code>ul [ class "list" ] (List.map (\item -&gt; li [] [ text item ]) model.items)</code></p>