Using jQuery to select multiple values of attributes across a collection of objects

Question

Hello jQuery Masters,

In this example I am selecting a bunch of 'A's within 'LI's (it doesn't really matter what I am selecting, just know I am returning a group of 'A' tags that all have the same "attribute structure").

I was wondering how I would go about returning a comma delimited list (or object/collection) of "attribute values". I was wondering if it can be done without a loop.

alert($(".bzsUserSelector-selected A"));
// this returns "[object]", which is expected

alert($(".bzsUserSelector-selected A").length);
// this returns "4", which is expected for my example

alert($(".bzsUserSelector-selected A").attr("myAttribute"))
// this returns "aaa", which is the value of the FIRST "myAttribute" only, I don't want that.
// I want something like this  "aaa, bbb, ccc, ddd"

I would like that to return an object of 4 items and just the 4 values of the "myAttribute" attribute.

I hope this is clear enough. Thanks in advance. - Mark

Answer 1

Well, there are a lot of ways to do this, butthis particular way is relatively concise and makes use of the makeArray and map functionality in jQuery.

$('li').map(function() {
  return $(this).attr("myAttribute")
}).get().join(',')