Edit in JSFiddle

jQuery.fn.extend({
    renameAttr: function(name, newName, removeData) {
        var val;
        return this.each(function() {
            val = jQuery.attr(this, name);
            jQuery.attr(this, newName, val);
            jQuery.removeAttr(this, name);
            // move original data
            if (removeData !== false) {
                jQuery.removeData(this, name.replace('data-', ''));
            }
        });
    }
});

$(function() {

    var t = $('#test'),
        result = function(m, t1, t2) {
            // data-attr="value" is stored as .data("attr") = value
            var t1d = t1.replace('data-', ''),
                t2d = t2.replace('data-', ''),
                x = '<h2>' + m + '</h2>' + t1 + ' = ' + t.attr(t1) + ', data("' + t1d + '") = ' + t.data(t1d) + ' <br>' + t2 + ' = ' + t.attr(t2) + ', data("' + t2d + '") = ' + t.data(t2d) + ' <br><br>';
            x = x.replace(/= undefined/g, '= <span class="und">undefined</span>').replace(/= testing/g, '= <span class="tst">testing</span>');
            $('#result').append(x);
        }

        result('Original', 'data-test1', 'data-test2');

    // rename data-test1 to data-test2 and update the data
    t.renameAttr('data-test1', 'data-test2');

    result('Rename &amp change data<br>$("#test").renameAttr("data-test1", "data-test2");', 'data-test1', 'data-test2');

    // rename data-test2 to data-test3 but don't update the data
    t.renameAttr('data-test2', 'data-test3', false);

    result('Rename without data change<br>$("#test").renameAttr("data-test2", "data-test3", false);', 'data-test2', 'data-test3');

});
<h1>jQuery Rename Attribute (renameAttr)</h1>

<div id="test" data-test1="testing"></div>

<div id="result"></div>

body {background: #333; color: #ddd;}
h1 { font-size: 120%; margin-bottom: 10px; }
h2 { font-size: 110%; color: #ddd; }
#result { color: #bbb; }
.und { color: #888; }
.tst { color: #0f0; }