targeting right html selector angular js
<p>I am working on an angular directive and i am trying to prepend an element. </p>

<pre><code>.directive('someDirective', function($compile){
  restrict: "E",
  scope:{
   items="@"
  }
  link: function(scope,elem,attrs){
    // selector 
    angular.element(div &gt; ul).prepend($compile('&lt;p&gt; Hello World &lt;p&gt;') (scope))
  },
  template:`
  &lt;div class="container"&gt; 
    &lt;ul class="foo"&gt;
      &lt;li ng-repeat="item in items"&gt; {{ item }} &lt;/li&gt; 
    &lt;/ul&gt;
  &lt;/div&gt;`
});
</code></pre>

<p>it appends inside ul. How am i supposed to append the element after the ul tag?</p>

<pre><code>&lt;div class="container"&gt; 
    &lt;ul class="foo"&gt;
      &lt;!-- prepend element goes here :( --&gt; 
      &lt;li ng-repeat="item in items"&gt; {{ item }} &lt;/li&gt; 
    &lt;/ul&gt;
 &lt;!-- I want the prepended element to go here --&gt;
  &lt;/div&gt;`
</code></pre>

<p>i believe there is something wrong with my selector. </p>