title: React - Dynamic creation of List item inside component
body: <p>Is there any way to add dynamical <code>li</code> element into my <code>ul</code> list ?
  I'd like add my <code>li</code> by clicking the button. Here is example code</p>
  
  <pre><code>class Component1 extends React.Component {
  
      constructor() {
          super();
      }
  
      add() {
          let ul = document.getElementById('mylist');
          let li = document.createElement('li');
          li.appendChild(document.createTextNode({some_variables});
          ul.appendChild(li);
      }
      render() {
          return (
                  &lt;a href="#" onClick={() =&gt; this.add()}&gt;Add&lt;/a&gt;
                  &lt;ul id="mylist"&gt;
                      /* dynamic list ITEM  */
  
                  &lt;/ul&gt;
          );
      }
  }
  
  ReactDOM.render(&lt;Component1 /&gt;, document.getElementById('root'));
  </code></pre>
  
  <p>Of course current function <code>add()</code> doesn't work on React</p>