I have the following html structure.

```
<ul>
  <script id="agendaTmpl" type="text/x-jquery-tmpl">
               <li class="arrow boundElement" style="height:40px;" onclick="GoToPage('session.html?session_id=${agenda_id}');">

                </li>
    </script>
 <li class="arrow boundElement" style="height:40px;" onclick="GoToPage('session.html?     session_id=2');"> test</li>
 <li class="arrow boundElement" style="height:40px;" onclick="GoToPage('session.html?     session_id=2');"> test</li>
</ul>

```

I need to apply class to the first li of the list. 
The script tag cannot be removed, coz it is a template for the structure. 
I tried with `ul > li:first-child` but it is not working. It works only if the li is the first child of the ul, i.e. if the script tag is not present.

Please suggest me a way to apply style to the first li of the ul.

Note: I am not allowed to add a new class to the first li.