Simple jquery function to trim a line of text with ellipses on left side, like text-overflow: ellipsis clip will in Firefox only. Changes the text permanently, so the amount of text hidden will not change when the window is resized. For this to work, the element you pass in needs to have overflow: hidden and white-space: nowrap; http://stackover…

jquery.trimleft.js

/**
 * Simple jquery function to trim a line of text with ellipses on left side,
 * like text-overflow: ellipsis clip will in Firefox only.  Changes the text 
 * permanently, so the amount of text hidden will not change when the window
 * is resized.
 * For this to work, the element you pass in needs to have overflow: hidden
 * and white-space: nowrap;
 * 
 * http://stackoverflow.com/questions/9793473/text-overflow-ellipsis-on-left-side
 */
$.fn.trimLeft = (function(){
	var trimContents = function(row, node){
		while (row.scrollWidth > row.offsetWidth) {
			
			var childNode = node.firstChild;
			
			if (!childNode)
				return true;
			
			if (childNode.nodeType == document.TEXT_NODE){
				trimText(row, node, childNode);
			}
			else {
				var empty = trimContents(row, childNode);
				if (empty){
					node.removeChild(childNode);
				}
			}
		}
	}
	var trimText = function(row, node, textNode){
		var value = '...' + textNode.nodeValue;
		do {
			value = '...' + value.substr(4);
			textNode.nodeValue = value;
			
			if (value == '...'){
				node.removeChild(textNode);
				return;
			}
		}
		while (row.scrollWidth > row.offsetWidth);
	}

	return function(row){
		this.each(function(i, row){
			trimContents(row, row);
		});
		return this;
	}
})();