Is there a way to modify a specific attribute of every jquery object in one call?

Question

Basically.... I am using this code

var editorLinks;
editorLinks = $(".admin_editor_link.html");
$.each(editorLinks, function(i, link){
    $(link).html($(link).attr("data-loadedtext"));
});

And I am wondering if there is some way to do it without the $.each call... like...

editorLinks.html($(this).attr("data-loadedtext"));

I assumed this would work (or some variation of it that I cant remember) but when I tried it all elements html was set to the data-loadedtext of the first element in the array.

iCollect.it Ltd · Accepted Answer · 2015-02-12 15:02:59Z

2

Use a function supplied to html():

   editorLinks.html(function(){
        return $(this).attr("data-loadedtext");
   });

The return value of the function is used as the value for html() for each element.

Using your example HTML in comment:

JSFiddle: http://jsfiddle.net/TrueBlueAussie/taesc0tt/2/

edited Feb 12, 2015 at 15:02

answered Feb 12, 2015 at 14:26

iCollect.it Ltd

93.9k26 gold badges189 silver badges210 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Marie Over a year ago

Thanks! That is pretty much what I was looking for. I was hoping there was a way to just use 'this' without a function but that is still an easy call. If you are still curious the HTML is really simple, I basically just have a few of these <button type="button" class="admin_editor_link html" data-loadedtext="Main Content Editor" data-toedit="1"></button>. My first attempt was editorLinks.html(editorLinks.attr("data-loadedtext")); but... yeah...

iCollect.it Ltd Over a year ago

Down-voter: care to explain why you have downvoted a correct working answer with working example?

Andy · Accepted Answer · 2015-02-12 15:15:14Z

1

Yes, you can, but you'll need to change the name of your class to admin_editor_link because jQuery selector is trying to find elements with both admin_editor_link and html classes. (Unless, of course, you actually looking for elements with both those classes - your question has no HTML code to verify that - in which case you're fine).

<div data-loadedtext="1" class="admin_editor_link"></div>
<div data-loadedtext="2" class="admin_editor_link"></div>

Just use a function to return the result

var editorLinks = $(".admin_editor_link");

editorLinks.html(function () {
  return $(this).attr("data-loadedtext");
});

DEMO

DEMO with both classes

edited Feb 12, 2015 at 15:15

answered Feb 12, 2015 at 14:38

Andy

63.6k13 gold badges72 silver badges99 bronze badges

4 Comments

Marie Over a year ago

Sorry, I was looking for elements with both. I actually have a few different types of "editors" and the class determines the type (html, text, db)

Andy Over a year ago

Cool, that second demo has what you want.

iCollect.it Ltd Over a year ago

Amusing how your JSFiddles have my code and not yours :)

Andy Over a year ago

Nice spot. I changed it to data in a previous iteration of the demo and forgot to change it back again.

Collectives™ on Stack Overflow

Is there a way to modify a specific attribute of every jquery object in one call?

2 Answers 2

2 Comments

4 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

4 Comments

Your Answer

Sign up or log in

Post as a guest

Related