Saturday, October 30, 2010

How to select the Inner Most Element

Today I was working on new category browser UI for the project I am working. I had to select the innermost element and append some more content into it. Basically, I had an HTML like this:

<div>Outermost element 
<div>Some Text
<div>Evenmore text
<div>Who cares anymore?
<div>Innermost Element</div>
</div>
</div>
</div>

</div>

So I needed to select the innermost div and append another div to it. There is no jQuery selector but you can use selectors that exist to achieve this goal. The innermost element would be the last div with the only-child.

$('div:only-child:last'); 
// Change background color to gray
$('div:only-child:last').css('background-color',"#ccc");

1 comment:

  1. You have some really good ideas in this article. I am glad I read this. I agree with much of what you state in this article. Your information is thought-provoking, interesting and well-written. Thank you.

    www.imarksweb.org

    ReplyDelete