diff --git a/docs/src/index.html.erb b/docs/src/index.html.erb
index 91f59c6..0ccf5b8 100644
--- a/docs/src/index.html.erb
+++ b/docs/src/index.html.erb
@@ -9,7 +9,7 @@
     $('#example-fade').tipsy({fade: true});
     
     $('#example-custom-attribute').tipsy({title: 'id'});
-    $('#example-callback').tipsy({title: function() { return this.getAttribute('original-title').toUpperCase(); } });
+    $('#example-callback').tipsy({title: function() { return this.getAttribute('data-original-title').toUpperCase(); } });
     $('#example-fallback').tipsy({fallback: "Where's my tooltip yo'?" });
     
     $('#example-html').tipsy({html: true });
@@ -132,7 +132,7 @@ an anchor tag's title attribute.</p>
 </p>
 
 <div class='caption'>Callback example:</div>
-<div class='code'><pre>$('#example-callback').tipsy({title: function() { return this.getAttribute('original-title').toUpperCase(); } });</pre></div>
+<div class='code'><pre>$('#example-callback').tipsy({title: function() { return this.getAttribute('data-original-title').toUpperCase(); } });</pre></div>
 
 <p>Finally, it is possible to specify a fallback tooltip for any element which does not
   have any tooltip text:</p>
@@ -195,7 +195,7 @@ an anchor tag's title attribute.</p>
 
   <p>Tipsy tooltips are 'live' - if the source attribute's value changes, the tooltip text will be
     updated the next time the tooltip is shown. There's one caveat - if you wish to remove the tooltip
-    by setting the <code>title</code> attribute to an empty string, set the <code>original-title</code>
+    by setting the <code>title</code> attribute to an empty string, set the <code>data-original-title</code>
     attribute instead (this only applies if you're using the <code>title</code> attribute).
   </p>
   
@@ -204,7 +204,7 @@ an anchor tag's title attribute.</p>
     <a href='#' rel='tipsy' title=''>Hover over me</a> |
     New tooltip text:
     <input type='text' value='' size='10' />
-    <input type='button' onclick="$('#dynamic-example a')[0].setAttribute('original-title', $('#dynamic-example input').val())" value='Update' />
+    <input type='button' onclick="$('#dynamic-example a')[0].setAttribute('data-original-title', $('#dynamic-example input').val())" value='Update' />
   </div>
 
   <script type='text/javascript'>
@@ -320,7 +320,7 @@ an anchor tag's title attribute.</p>
 
   <p>Tipsy needs to erase any existing value for an element's <code>title</code> attribute in
     order to suppress the browser's native tooltips. It is stashed in the element's
-    <code>original-title</code> attribute in case you need to retrieve it later.</p>
+    <code>data-original-title</code> attribute in case you need to retrieve it later.</p>
   
   <p>As of version 0.1.4, the tooltip text is recomputed on every hover event so updating the
     <code>title</code> attribute will have the expected effect.</p>
diff --git a/src/javascripts/jquery.tipsy.js b/src/javascripts/jquery.tipsy.js
index f95c063..230cc27 100644
--- a/src/javascripts/jquery.tipsy.js
+++ b/src/javascripts/jquery.tipsy.js
@@ -90,8 +90,8 @@
         
         fixTitle: function() {
             var $e = this.$element;
-            if ($e.attr('title') || typeof($e.attr('original-title')) != 'string') {
-                $e.attr('original-title', $e.attr('title') || '').removeAttr('title');
+            if ($e.attr('title') || typeof($e.attr('data-original-title')) != 'string') {
+                $e.attr('data-original-title', $e.attr('title') || '').removeAttr('title');
             }
         },
         
@@ -100,7 +100,7 @@
             this.fixTitle();
             var title, o = this.options;
             if (typeof o.title == 'string') {
-                title = $e.attr(o.title == 'title' ? 'original-title' : o.title);
+                title = $e.attr(o.title == 'title' ? 'data-original-title' : o.title);
             } else if (typeof o.title == 'function') {
                 title = o.title.call($e[0]);
             }