Question

so basically here is my script:

http://jsfiddle.net/JJFap/42/

Code –

jQuery(document).ready(function() {
    var rel = new Array();
    var count = 0;
    jQuery(".setting").each(function() {
        rel[count] = [];
        if(jQuery("span").attr("rel")) {
            rel[count].push(jQuery("span").attr("rel"));
        }  
        console.log(count);
        count++;
    });               
    jQuery("body").text(rel);
    console.log(rel);
});​

and

<div class="setting">
    <span rel="Variable">Variable</span>
    <span rel="Item">Item</span>
    <span rel="Something">Something</span>
</div>
<div>
    <span rel="Smth">Smth</span>
    <span>Sec</span>
</div>
<div class="setting">
    <span>Second</span>
    <span rel="first">First</span>
    <span rel="Third">Third</span>
</div>

​my question, is why does it display Variable, variable?

I would like it to display Variable, First, but I’m not able to do.

Basically what I would like to achieve is create new array, in which insert each div.setting span elements with rel attribute array.

So basically in this example it should output –

Array (

   Array[0] => "Variable","Item","Something";

   Array[1] => "first","Third";

)

Hope you understood what I meant 🙂

EDIT:

In my other example I tried to add jQuery(“span”).each(function() … inside first each function, but it outputted two full arrays of all span elements with rel. I can’t have different classes / ids for each div element, since all will have same class.

Answer 1

In addition to what has been said, you can also get rid of the count and one push() when using jQuery.fn.map() as well as getting rid of the if when adding [rel] to the selector:

jQuery(document).ready(function() {
    var rel = [];
    jQuery(".setting").each(function() {
        rel.push(jQuery(this).find('span[rel]').map(function() {
            return this.getAttribute('rel');
        }).get());
    });               
    jQuery("body").text(rel);
    console.log(rel);
});