Manipulate HTML with jQuery
<p>I'm trying to style some HTML, generated from <a href="http://en.wikipedia.org/wiki/Google_Calendar" rel="nofollow">Google Calendar</a>, it's something I don't have control off. It's plain simple HTML.</p>

<p>This is what I have:</p>

<pre><code>    &lt;li&gt;&lt;a&gt;&lt;span class="data"&gt;When: gio 27 gen 2011&lt;br /&gt;&lt;br /&gt;Where: XXXX&lt;br /&gt;Event state: confirmed&lt;/span&gt;&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a&gt;&lt;span class="data"&gt;When: gio 20 gen 2011&lt;br /&gt;&lt;br /&gt;Where: XXXX&lt;br /&gt;Event state: confirmed&lt;/span&gt;&lt;/a&gt;&lt;/li&gt; 
</code></pre>

<p>This is what I'm trying to get:</p>

<pre><code>&lt;li&gt;
    &lt;a&gt;
        &lt;span class="when"&gt;When:&lt;/span&gt;
        &lt;span class="day"&gt;gio&lt;/span&gt;
        &lt;span class="number"&gt;27&lt;/span&gt;
        &lt;span class="month"&gt;gen&lt;/span&gt;
    &lt;/a&gt;    
&lt;/li&gt;
&lt;li&gt;
    &lt;a&gt;
        &lt;span class="when"&gt;When:&lt;/span&gt;
        &lt;span class="day"&gt;gio&lt;/span&gt;
        &lt;span class="number"&gt;20&lt;/span&gt;
        &lt;span class="month"&gt;gen&lt;/span&gt;
    &lt;/a&gt;    
&lt;/li&gt;
</code></pre>

<p>With this messy code:</p>

<pre><code>$(function(){
    var words = $('div.data').text().split(" ");    
    $("div.data").html("&lt;span&gt;" + words + "&lt;/span&gt;");
    $("div.data span:first").addClass("when");  
});
</code></pre>

<p>And this is what I get:</p>

<pre><code>   &lt;li&gt;
    &lt;a title="" class="tip"&gt;
        &lt;div class="data"&gt;
            &lt;span class="when"&gt;
                &lt;a xmlns="http://www.w3.org/1999/xhtml"&gt;when:,gio,27,gen,2011
where:,XXX,XXX
Event,state:,confirmedWhen:,gio,20,gen,2011
where:,XXX,XXX
Event,sate:,confirmed
                &lt;/a&gt;
            &lt;/span&gt;
        &lt;/div&gt;
    &lt;/a&gt;    
&lt;/li&gt;
</code></pre>

<p>As you can see I have this new &lt;a> element (why?) and both &lt;li> texts are inside the same &lt;span>. Twice (to be honest, the second doesn't have the "when" class). This should not be hard to do. It's just too hard for me.</p>
