$(document).ready(function() {
  
  $('.auto-split').each(function() {
    
    var titleArray, newtitle, titleLength, greyWords;
    titleArray = $(this);
    titleArray = titleArray;
    titleArray = titleArray.html();
    titleArray = titleArray.replace(/^\s\s*/, '').replace(/\s\s*$/, '');
    titleArray = titleArray.replace(/( )/g,' ');
    titleArray = titleArray.split(' ');
    newTitle = '';
    titleLength = titleArray.length;
    greyWords = Math.floor( (titleLength/2) );
    
    newTitle += '<span class="group1">';
    
    if ( (titleArray.length != 0) || (titleArray.length != 1) ){
      for(i = 0; i <= greyWords - 1; i++) {
        newTitle += titleArray[i] + ' ';
      }
      
      newTitle += '<span class="group2">';
      
      for(i = greyWords; i <= titleLength - 1; i++) {
        newTitle += titleArray[i] + " ";
      }
      
      newTitle += '</span>';
    }
    
    $(this).html(newTitle);
  });
});