Nesting a text inside a tag in slim

Question

How do I nest the 'Featured' text inside the a tag, given the span, the text, and the other span are siblings?

li
  a href="#" class="selected"
    span class="icon-before"
    Featured
    span class="icon-after"

Jennefer

Answer 1

li
  a href="#" class="selected"
    span class="icon-before"
    | Featured
    span class="icon-after"

Gives:

<li><a class="selected" href="#"><span class="icon-before"></span>Featured<span class="icon-after"></span></a></li>

Unhallowed

Answer 2

ul
  li
    | first text
    span.color-red.bold-g
     | (text transform)

Give :

<ul><li>first text<span class="color-red bold-g">(text transform)</span></li>

Thyroxine