title: How to insert HTML element inside another HTML element in directive template?
body: <p>I have a directive with simple template:</p>
  
  <pre><code>restrict: 'E',
  link: function(scope, element, attrs) {},
  template: '&lt;ul&gt;&lt;/ul&gt;
  </code></pre>
  
  <p>How can I add inside the template li elements dynamically with code in the link function?
  My li list is HTML elements:</p>
  
  <pre><code>var newElement = $compile("&lt;li&gt;&lt;div&gt;my text&lt;/div&gt;&lt;/li&gt;")(scope);
  element.append(newElement);
  </code></pre>
  
  <p>This will not add newElement as a child of ul...</p>