How to set different css attributes with JQuery?


Tags: jquery,html,css

Problem :

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>


Solution :

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);
});

    CSS Howto..

    How to stack two UL classes directly on top of one another in the middle of the page

    How to vertically center content in before or after in CSS

    jQuery: How can I set css with own width?

    CSS floats - how do I keep them on one line?

    CSS - How to centre a link button

    How to navigate from one field to another field using Enter Key function in MVC5

    How to vertically align label and input in Bootstrap 3?

    How to show hidden part of an image which is inside a fixed height div, using just the CSS?

    CSS/HTML problem in IE - how to fix?

    How to set an Ionic list item height with a background image

    How to set a External SVG color in HTML using CSS?

    On DropDown/HTML Select Show Modal PopUp

    How do I keep the 'hover' effect while using a Jquery color change effect while scrolling

    How to target tablet devices with CSS queries

    How can I use a CSS3 transform on an element without stretching the text inside it?

    css how can i center multiple elements with absolute position

    how to make
  • add css class active after refreshing page?
  • How do I use a gradient as a font color in CSS?

    I can not load the CSS pages which can be accessed after a login carry with spring security. How can I fix it?

    How to include this basic html (CSS, JavaScript) template into a php file?

    How to have a video take up the viewport height and width?

    How can I make DIV 100% height of browser without vertical scrolling of header

    How to dynamically change width of Div1 inside a scrollable Div2 to Div2's width

    How do I make a row of 5 responsive using percentage widths?

    how to fix the css padding in this situation?

    CSS: how to make a span only as wide as its content

    How to reach CSS zen?

    How to show only the div with id while hiding other divs using CSS only

    How can I fix my CSS/HTML that uses input:checked, to prevent radio button movement?

    CSS - How make the page scroll over the edge of the window