Jquery :first-line for IE8
<p>I have a need to wrap the first line of the following sentences inside :</p>

<pre><code>&lt;span class="span"&gt;This is the first line &lt;br&gt; this should be the second line&lt;/span&gt;
&lt;span class="span"&gt;This is another first line &lt;br&gt; this should be another second line&lt;/span&gt;
</code></pre>

<p><strong>Using jquery:</strong></p>

<pre><code>$('.span:first-line').wrap('&lt;em&gt;&lt;/em&gt;');
</code></pre>

<p>I expected the result:</p>

<pre><code>&lt;span class="span"&gt;&lt;em&gt;This is the first line &lt;/em&gt;&lt;br&gt; this should be the second line&lt;/span&gt;
</code></pre>

<p><strong>The CSS:</strong></p>

<pre><code>.span {
    display:block;
    white-space:pre;
}
</code></pre>

<p>But no matter what IE do not seem to recognize it.</p>

<p>Looping through each resulting unexpected:</p>

<pre><code>$('.span:first-line').each(function() {
    $(this).wrap('&lt;em&gt;&lt;/em&gt;');
});
</code></pre>

<p><strong>Bad Result:</strong></p>

<pre><code>&lt;em&gt;&lt;span class="span"&gt;.................&lt;/span&gt;&lt;/em&gt;
</code></pre>

<p><strong>Also:</strong></p>

<pre><code>$('.span').each(function() {
    $(this).filter(':first-line').wrap('&lt;em&gt;&lt;/em&gt;');
});
</code></pre>

<p>Does anyone know other way to wrap the first line broken by a line break (<code>&lt;br&gt;</code>) whitespace to make it work for IE8?</p>

<p>Thanks</p>
