Question

The content is brought dynamically so I need to be able to put in a ordered list on the fly..

Currently, it’s bringing in my text like this with the white-spaces:

<div class="born">BORN RESIDENCE PLAYS FAVORITE</div>

This is the intended format I am trying to accomplish but no luck..

<div class="born">
  <ul>
   <li>BORN</li>
   <li>RESIDENCE</li>
   <li>PLAYS</li>
   <li>FAVORITE</li>
 <ul>
</div>

Answer 1

I’m sure there’s a less hacky way, but:

var text = $("div.born").text();
var textArr = text.split(" ");
$("div.born").html('<ul></ul>');
$.each(textArr, function (k, v) {
    $("div.born ul").append('<li>' + v + '</li>');
});

Example: http://jsfiddle.net/KKauk/