title: How to target flex item by its order number?
body: <p>I need to rearrange my <em>flex items</em> in their container programmatically, but I can't seem to find how to select them by their <code>order</code> numbers. The problem is that they are not shown in their DOM order, but using <code>order</code> css attribute.</p>
  
  <blockquote>
    <p>How do I rearrange them?</p>
  </blockquote>
  
  <p>my html:</p>
  
  <pre><code>&lt;div id="container"&gt;
      &lt;div style="order: 17"&gt;&lt;/div&gt;
      &lt;div style="order: 25"&gt;&lt;/div&gt;
      &lt;div style="order: 2"&gt;&lt;/div&gt;
      &lt;div style="order: 3"&gt;&lt;/div&gt;
      // ...
  &lt;/div&gt;
  </code></pre>
  
  <p>Basically I need to do this:</p>
  
  <pre><code>| A | B | C | D | E |
         +-----------&gt;
       &lt;---+---+---+
  result:
  | A | C | D | E | B |
  </code></pre>