How to remove attributes at a time using jquery

Question

$('#myImage').removeAttr('class').removeAttr('style').removeAttr('border');

That one works just fine but is there a way to remove a set of attributes from an element?

I altered the code a bit, like

$.fn.removeAttrs = function () {
    // Convert all passed arguments to an array
    var args = arguments[0].split(' '),
        attr;

    // Loop, removing the first array item on each iteration
    while (attr = args.shift())
        this.removeAttr(attr);

    // Return the jQuery object for chaining
    return this;
}

call it like below

$('#myImage').removeAttrs('class style border');

possible duplicate of [Remove all attributes](http://stackoverflow.com/questions/1870441/remove-all-attributes) — RPM1984, Nov 15 '10 at 09:41
@RPM1984: that's not quite the same; this question is asking to remove *some*, not *all* attributes so the answers will be fundamentally different. — Andy E, Nov 15 '10 at 09:43
Yes - i was going to post an answer but figured in that Q @cletus' answer was great, and all it would take would be a 1 liner for the OP (pass through the list of attributes to remove). — RPM1984, Nov 15 '10 at 09:46

Andy E · Accepted Answer · 2010-11-15T10:21:17.257

No, but you could write your own easily enough:

$.fn.removeAttrs = function () {
    // Convert all passed arguments to an array
    var args = Array.prototype.slice.call(arguments),
        attr;

    // Loop, removing the first array item on each iteration
    while (attr = args.shift())
        this.removeAttr(attr);

    // Return the jQuery object for chaining
    return this;
}

$('#myImage').removeAttrs('class', 'style', 'border');

Here's one with a few different overloads, jQuery style:

$.fn.removeAttrs = function () {
    // Convert all passed arguments to an array
    var args = Array.prototype.slice.call(arguments),
        attr;

    // Handle passing arrays or space-separated strings
    if (args.length == 1)
        args = $.isArray(args[0]) ? args[0] : args[0].split(" ");

    // Loop, removing the first array item on each iteration
    while (attr = args.shift())
        this.removeAttr(attr);

    // Return the jQuery object for chaining
    return this;
}

// Now all of the following will work 
$('#myImage').removeAttrs(['class', 'style', 'border']);
$('#myImage').removeAttrs('class', 'style', 'border');
$('#myImage').removeAttrs('class style border');

Wow! this is super cool.. i just did the same thing like passing attrs as space-separated string.. getting an error there — Naresh, Nov 15 '10 at 10:14
Gottcha, i just need to split the first index of passed arguments :) — Naresh, Nov 15 '10 at 10:17
@Naresh: had a small error (calling `splice` instead of `slice` to convert the arguments) - I've updated it now :-) — Andy E, Nov 15 '10 at 10:23

score 1 · Answer 2 · answered Aug 24 '13 at 13:40

You already have a function in jquery

jQuery(element).removeAttr('attribute1 attribuite2 attribute3');

will remove all attributes in one go .

http://api.jquery.com/removeAttr/ here removeAttr can consume a list

Demo : just even for this very stackoverflow page in developer console do

jQuery('div#footer').removeAttr('id class')

This will remove both attributes id and class from the div

score 0 · Answer 3 · answered Nov 15 '10 at 09:43

0

I wrote this, SO HAPPY!

// classNames is an array of attribute names you want to remove from the element.
// jQueryElement is the jQuery element to remove the attributes from.
function removeSetOfAttributesFromAnElement(attNames, jQueryElement) {
    $.each(attNames, function() {
        jQueryElement.removeAttr(this);
    }
}

// call it!
removeSetOfAttributesFromAnElement(['class','style','border'], $("#myImage"));

answered Nov 15 '10 at 09:43

Luca Matteis

29,161
19
114
169

Nice, can i call it like this? $('#myImage').removeSetOfAttributesFromAnElement(['class','style','border']) – Naresh Nov 15 '10 at 09:50
@Naresh, you can probably hook-up the chaining functionality using the `$.fn` the namespace as Andy pointed out. – Luca Matteis Nov 15 '10 at 10:01

score 0 · Answer 4 · answered Nov 15 '10 at 09:45

0

Not directly. First ask is that really what you want to do. Bearing in mind you will loose the Id attribute.

But if you must what you could do is really create a new tag same as your source tag (DIV, etc) then get the source html using $('#target').html($('#source').html());

answered Nov 15 '10 at 09:45

Slappy

4,042
2
29
41

Apologies for misunderstanding the question. My approach will rid the tag of all attributes. – Slappy Nov 15 '10 at 09:46

How to remove attributes at a time using jquery

4 Answers4