diff --git a/examples/dom-elements.html b/examples/dom-elements.html
index 8784464..ed2a614 100644
--- a/examples/dom-elements.html
+++ b/examples/dom-elements.html
@@ -11,6 +11,7 @@
 	<link rel="import" href="fruit-icon.html">
 	<link rel="import" href="project-docs.html">
 	<style shim-shadowdom>
+		.indent { margin-left: 65px; }
 		sortable-table { width: 500px; margin-left: 65px; }
 		sortable-table::shadow td.column-alice,
 		sortable-table::shadow td.column-bill,
@@ -47,7 +48,7 @@ <h1>DOM Elements</h1>
 		{ "fruit":"pear",	"alice": 4,	"bill": 2,	"casey": 8 },
 		{ "fruit":"strawberry",	"alice": 0,	"bill": 14,	"casey": 0 }
 	]
-&lt;/sortable-table&gt;	</prism-js>
+&lt;/sortable-table&gt;</prism-js>
 
 	<p>
 
@@ -96,5 +97,43 @@ <h1>DOM Elements</h1>
 		 [ "pear", 4, 2, 8 ],
 		 [ "strawberry", 0, 14, 0 ]]
 	</sortable-table>
+
+	<h2>Binding in DOM Elements</h2>
+
+	All attributes (excluding <code>name</code>) in each <code>sortable-column</code> can be bound to.
+
+	<prism-js language="markup">&lt;sortable-table&gt;
+	&lt;sortable-column name="fruit" title="{{column1}}"&gt;&lt;/sortable-column&gt;
+	&lt;sortable-column name="alice"&gt;{{column2}}&lt;/sortable-column&gt;
+	[
+		{ "fruit":"apple",	"alice": 4,	"bill": 10,	"casey": 2 },
+		{ "fruit":"banana",	"alice": 0,	"bill": 4,	"casey": 0 },
+		{ "fruit":"grape",	"alice": 2,	"bill": 3,	"casey": 5 },
+		{ "fruit":"pear",	"alice": 4,	"bill": 2,	"casey": 8 },
+		{ "fruit":"strawberry",	"alice": 0,	"bill": 14,	"casey": 0 }
+	]
+&lt;/sortable-table&gt;</prism-js>
+
+	<template is="auto-binding">
+		<table class="indent">
+			<tr>
+				<td>Column 1 title : </td><td><input type="text" value="{{column1}}"></td>
+			</tr>
+			<tr>
+				<td>Column 2 #text : </td><td><input type="text" value="{{column2}}"></td>
+			</tr>
+		</table>
+		<sortable-table class="default">
+			<sortable-column name="fruit" title="{{column1}}"></sortable-column>
+			<sortable-column name="alice">{{column2}}</sortable-column>
+			[
+				{ "fruit":"apple",		"alice": 4,	"bill": 10,	"casey": 2 },
+				{ "fruit":"banana",		"alice": 0,	"bill": 4,	"casey": 0 },
+				{ "fruit":"grape",		"alice": 2,	"bill": 3,	"casey": 5 },
+				{ "fruit":"pear",		"alice": 4,	"bill": 2,	"casey": 8 },
+				{ "fruit":"strawberry",	"alice": 0,	"bill": 14,	"casey": 0 }
+			]
+		</sortable-table>
+	</template>
 </body>
 </html>
diff --git a/sortable-table.html b/sortable-table.html
index 2549eb4..e12ab24 100644
--- a/sortable-table.html
+++ b/sortable-table.html
@@ -436,37 +436,30 @@
 				var columnNodes = this.querySelectorAll('sortable-column');
 				var c = [];
 				var self = this;
-				if(columnNodes.length > 0){
-					[].forEach.call(columnNodes, function(n, index) {
-						var name = n.getAttribute('name');
-						if(!name || name === '') name = index;
-						if(String(name).indexOf(' ') > -1) alert('Column name `'+name+'` contains an illegal character (` `)');
-						var title = n.getAttribute('title');
-						if(!title || title === '') title = n.textContent.trim();
-						if(title === '') title = name;
-						var formula = n.getAttribute('formula');
-						if(formula){
-							var match = formula.match(/function[^\(]*\(([^\)]*)\)[^\{]*{([^\}]*)\}/);
-							if (match) {
-								var args = match[1].split(',').map(function(arg) { return arg.replace(/\s+/, ''); });
-								formula = new Function(args, match[2]);
-							}else if(self[formula]){
-								//not an inlined function, assume it's a member of this
-								formula = self[formula]
-							}else if(PolymerExpressions.prototype[formula]){
-								//not an inlined function, or member of this, check PolymerExpressions.prototype
-								formula = PolymerExpressions.prototype[formula];
-							}else if(formula.substring(0,29) === 'PolymerExpressions.prototype.'){
-								var f = formula.substring(29);
-								formula = PolymerExpressions.prototype[f];
-								if(!formula) alert('Could not load formula `'+ formula +'` from PolymerExpressions.prototype for column `' + name + '`');
-							}else alert('Could not load formula `'+ formula +'` for column `' + name + '`');
+				if(this.columnObserver) this.columnObserver.disconnect();
+				this.columnObserver = new MutationObserver(function(mutations) {
+					mutations.forEach(function(m) {
+						var sortableColumn = null;
+						if(m.type === 'attributes' && m.target.nodeName === 'SORTABLE-COLUMN'){
+							sortableColumn = self.readSortableColumn.call(self, m.target, null);
+						}else if(m.type === "characterData"){
+							sortableColumn = self.readSortableColumn.call(self, m.target.parentNode, null);
+						}
+						if(sortableColumn){
+							var i = self.columns.findIndex(function(e){
+								return e.name === sortableColumn.name;
+							});
+							self.columns.splice(i, 1, sortableColumn);
 						}
-						c.push({
-							name: name, title: title, formula: formula,
-							cellTemplate: n.getAttribute('cellTemplate'),
-							headerTemplate: n.getAttribute('headerTemplate'),
-							footerTemplate: n.getAttribute('footerTemplate')
+					});
+				});
+				if(columnNodes.length > 0){
+					[].forEach.call(columnNodes, function(n, index){
+						c.push(self.readSortableColumn.call(self, n, index));
+						self.columnObserver.observe(n, {
+							attributes: true,
+							subtree: true,
+							characterData: true
 						});
 					});
 					this.columns = c;
@@ -485,6 +478,38 @@
 				}
 			}
 		},
+		readSortableColumn: function(n, index){
+			var name = n.getAttribute('name');
+			if(!name || name === '') name = index;
+			if(String(name).indexOf(' ') > -1) alert('Column name `'+name+'` contains an illegal character (` `)');
+			var title = n.getAttribute('title');
+			if(!title || title === '') title = n.textContent.trim();
+			if(title === '') title = name;
+			var formula = n.getAttribute('formula');
+			if(formula){
+				var match = formula.match(/function[^\(]*\(([^\)]*)\)[^\{]*{([^\}]*)\}/);
+				if (match) {
+					var args = match[1].split(',').map(function(arg) { return arg.replace(/\s+/, ''); });
+					formula = new Function(args, match[2]);
+				}else if(this[formula]){
+					//not an inlined function, assume it's a member of this
+					formula = this[formula]
+				}else if(PolymerExpressions.prototype[formula]){
+					//not an inlined function, or member of this, check PolymerExpressions.prototype
+					formula = PolymerExpressions.prototype[formula];
+				}else if(formula.substring(0,29) === 'PolymerExpressions.prototype.'){
+					var f = formula.substring(29);
+					formula = PolymerExpressions.prototype[f];
+					if(!formula) alert('Could not load formula `'+ formula +'` from PolymerExpressions.prototype for column `' + name + '`');
+				}else alert('Could not load formula `'+ formula +'` for column `' + name + '`');
+			}
+			return {
+				name: name, title: title, formula: formula,
+				cellTemplate: n.getAttribute('cellTemplate'),
+				headerTemplate: n.getAttribute('headerTemplate'),
+				footerTemplate: n.getAttribute('footerTemplate')
+			};
+		},
 		/**
 		 *	Change Observers
 		 */
@@ -1035,5 +1060,28 @@
 			this.forceFooterRefresh++;
 		}
 	});
+	//polyfills
+	if (!Array.prototype.findIndex) {
+		Array.prototype.findIndex = function(predicate) {
+			if (this == null) {
+				throw new TypeError('Array.prototype.find called on null or undefined');
+			}
+			if (typeof predicate !== 'function') {
+				throw new TypeError('predicate must be a function');
+			}
+			var list = Object(this);
+			var length = list.length >>> 0;
+			var thisArg = arguments[1];
+			var value;
+
+			for (var i = 0; i < length; i++) {
+			value = list[i];
+			if (predicate.call(thisArg, value, i, list)) {
+				return i;
+			}
+			}
+			return -1;
+		};
+	}
 </script>
 </polymer-element>