Koks_rs
Koks_rs

Reputation: 680

How to set different css attributes with JQuery?

I want to set for each of input fields different z-index values. How I can do this with JQuery?

I want something like this:

   jQuery.each($("input[type=text]"), function (index, item) {

        item.css("z-index", index);
    });

But "item" has no css property. How to correctly iterate an array ?

HTML:

<div>
<input type="text" required class="form-control" id="Text4" placeholder="Some text"
    runat="server" />
<input type="text" required class="form-control" id="Text5" placeholder="Some text"
    runat="server" />
<input type="text" required class="form-control" id="Text6" placeholder="Some text"
    runat="server" />
</div>

Upvotes: 2

Views: 59

Answers (2)

antyrat
antyrat

Reputation: 27765

item in your code returns HTML element, not jQuery object.

I would suggest you to change your code to:

$("input[type=text]").each( function (index, item) {
    $( item ).css("z-index", index);
});

Upvotes: 3

Hitesh Vala Ahir
Hitesh Vala Ahir

Reputation: 793

Return the CSS property value:

$(selector).css(property)

Set the CSS property and value:

$(selector).css(property,value)

Set CSS property and value using a function:

$(selector).css(property,function(index,currentvalue))

Set multiple properties and values:

$(selector).css({property:value, property:value, ...})

Upvotes: 1

Related Questions