Change Color by character

gistfile1.js

//HTML ==>
<table>
  <tr>
    <td class="colorizeMe">foooo_bar</td>
  </tr>
  <tr>
    <td class="colorizeMe">hello_world</td>
  </tr>
  <tr>
    <td class="colorizeMe">dubidubi_doo</td>
  </tr>
</table>
-----------------------------------------------------------

//CSS ==>
.red { color:red; }
.blue { color:blue; }

-----------------------------------------------------------
//Javascript==>
var colorize = function(text) {
  var delimiter = "_",
      parts = text.split(delimiter),
      firstPart = $("<span>", { "class": 'red', html: parts[0] }),
      secondPart = $("<span>", { "class": 'blue', html: text.split(parts[0] + delimiter)[1] });

  return $("<div>").append(firstPart).append(delimiter).append(secondPart).html();
};

var colorizeElements = function($elements) {
  // $elements has to be something like $("td.classname")
  $elements.each(function() {
    $(this).html(colorize($(this).html()));
  });
};

// this is your actual call
colorizeElements($("td.colorizeMe"));