Change Element Type Using jQuery

June 19, 2024

Comes in handy when trying to meet WCAG 2.1 standards (as opposed to directly changing WordPress plugins for the edits to be wiped out on the next update).

(function($) {
    $.fn.changeElementType = function(newType) {
        var attrs = {};

        $.each(this[0].attributes, function(idx, attr) {
            attrs[attr.nodeName] = attr.nodeValue;
        });

        this.replaceWith(function() {
            return $("<" + newType + "/>", attrs).append($(this).contents());
        });
    };
})(jQuery);

Example usage:

$("b").changeElementType("h1");

Source.