clarification using css in jquery

Question

Code below works which came from a tutorial ive been following. i just want to understand some parts of the code.

function Arrow_Points() {
    var s = $('#container').find('.item');
    $.each(s, function (i, obj) {
        var posLeft = $(obj).css("left");

        if (posLeft == "0px") {
            html = "<span class='rightCorner'></span>";
            $(obj).prepend(html);
        } else {
            html = "<span class='leftCorner'></span>";
            $(obj).prepend(html);
        }
    });
}

1) what does the i in function used for? $.each(s,function(i,obj){ it was never used after it was declared.

2) this is my css for .item

.item {
width: 408px;
float: left;
min-height:50px;
}

the condition is if(posLeft == "0px") how did he/she came up with the value 0px ? are left floats default position is 0px ?

Answer 1

the i in the $.each iteration refers to the index of the element you are iterating over.

Specifically, for any Enumerable s , at every iteration of $.each() , s[i]===obj

See the official documentation of $.each

Answer 2

CSS:

float makes the element stick to left side of its parent container element.

So if the element is nested in the body element it should be predictably be on the left corner BUT css left must be explicitly defined in order to return a value .

How ever I see no relation between .item and this if condition.

Each:

As for for the i it used for the index, when it's not used it is sometimes marked as _ . You need to declare it if you want to handle each object as obj since it is the second argument this function takes and javscript "can't" guess what you meant when you wrote obj without it's counterpart. obj however is optional so if you only pass index it will work.