jQuery apply css to penultimate element?

I need to apply CSS to the 2nd to last element. Ive found an answer on this in the thread below: Get penultimate element

But how to开发者_StackOverflow I change the syntax to apply CSS? The following doesn't work:

$("a:last").prev().css('width','250px');

Thanks

Ive tried applying @tweak method's but it doesn't work.

setInterval(function(){
$(".image-cont:last .image-cont2").prev().css({ width,'250px' })
},1000); 

---

Try this:

$("a:last").prev().css({ width: '250px' });

---

Try this:

$("a:last").prev().add('a:last').css('width','250px');

It selects the 2nd last and the last element and adds the css.

---

Based on your post revision, I would suggest:

setInterval(function(){
$(".image-cont:last").prev().find(".image-cont2").css('width', '250px');
},1000); 

But without you posting your HTML and pinpointing the element you need, I'm still not sure if this is the answer you want.

By way of explanation: prev goes 'back' from the element you selected, and your selector selects a descendant of the 'last' element with class image-cont - so it will select the previous sibling of that descendant. My suggestion will select the descendant from the penultimate element with class image-cont.

---

Grab all but the last, then grab the last of that result:

$("p:not(:last)").filter(":last").addClass("hilight");

Demo: http://jsbin.com/ujuku4/edit

Of course, the following will work too:

$("p:last").prev().addClass("hilight");

Demo: http://jsbin.com/ujuku4/2/edit

If you have any problems with either of these methods it would most likely reflect a problem with your HTML and jQuery's inability to properly handle it.

---

This example will only work if the a tag are in a sibling structure like this

<a href="#">a</a>
<a href="#">a</a>
<a href="#">a</a>
<a href="#">a</a>

$("a:last").prev().css('width','250px');

If the a tags are inside other tag like this

<ul>
    <li><a href="#">a</a></li>
    <li><a href="#">b</a></li>
    <li><a href="#">c</a></li>
    <li><a href="#">d</a></li>
</ul>

$("a").not(":last").filter(":last").css('width','250px');

And then the problem can be that you can't set a CSS width on a inline element, so change the display to "inline-block" or "block"

$("a").not(":last").filter(":last").css({
    'width' : '250px',
    'display' : 'inline-block'
});

or

$("a:last").prev().css({
    'width' : '250px',
    'display' : 'inline-block'
});

---

Well I had the same problem but, with some differences. I wanted to change the focus of my inputs.

So i tried something, my advice is:

$("#yourelement").eq(-2).css('.myclass');

or

$("#urelement").eq(-2).attr({ width: 250});

It's not necessary to add 'px' ;)

Hope it works for you!