Selecting the last child elements of a div without looping

Question

Here's a quick one. I'm trying to get better at writing selectors for jquery because I seem to be relying on loops far too much in order to get things done.

In this particular example, I want to add the "Absolute" class too all of the divs that have the ganttview-block-container class except the last one in the parent ganntview-blocks div.

HTML:

<div class='ganttview-blocks'>    
 <div class='ganttview-block-container'></div>
 <div class='ganttview-block-container'></div>
 <div class='ganttview-block-container'></div>    
</div>

<div class='ganttview-blocks'>    
 <div class='ganttview-block-container'></div>
 <div class='ganttview-block-container'></div>
 <div class='ganttview-block-container'></div> 
</div>

Javascript:

$("div.ganttview-block-container").addClass("Absolute").addClass("Opacity");

$($("div.ganttview-blocks")).each(function () {
  var thisDiv = $(this);
  thisDiv.children("div.ganttview-block-container:last").removeClass("Absolute");    
});

My javascript/jquery accomplishes this goal correctly but it seems so inefficient. I'm confident there's a more elegant way of getting this done... perhaps even in 1 line.

Can anyone help? Thanks!

Possible duplicate: http://stackoverflow.com/questions/543513/getting-last-child-of-div — Hello71, Feb 16 '11 at 01:53
Possible duplicate: http://stackoverflow.com/questions/3768641/selecting-the-last-child — Hello71, Feb 16 '11 at 01:56
I took a look at those questions before posting but they didn't address what I was looking for specifically. — RoboKozo, Feb 16 '11 at 02:03

score 5 · Accepted Answer · answered Feb 16 '11 at 01:55

5

I think you need :not with :last-child:

$('.ganttview-block-container')
  .addClass('Opacity')
  .filter(':not(:last-child)')
    .addClass('Absolute');

answered Feb 16 '11 at 01:55

lonesomeday

233,373
50
316
318

Awesome! This is the type of stuff I was looking for. I've got to get more comfortable using :not and learn more about the other ':' options. – RoboKozo Feb 16 '11 at 01:59
1

@Robodude Have a look through [the API reference](http://api.jquery.com/category/selectors/) for starters. – lonesomeday Feb 16 '11 at 02:02
Thanks for the link! Will do! – RoboKozo Feb 16 '11 at 02:40

score 0 · Answer 2 · answered Feb 16 '11 at 01:52

0

why not just do

$("div.ganttview-blocks div.ganttview-block-container:last").each( ... )

That should get you the elements your after.

answered Feb 16 '11 at 01:52

Dave G

9,639
36
41

Selecting the last child elements of a div without looping

2 Answers2