Get position of the li jQuery

Question

We have a simple ul

<ul><li>text</li><li>text</li><li>text</li><li>text</li></div>

How do take a position of the <li>, from the top and left corner of the <ul>?

li is display: inline, ul has text-align: center. Text inside ul can be divided to several lines.

Answer 1

You should use .position(). You can select a specific li using :nth-child.

You'll also need to set position: relative on the ul.

For example, to obtain the position of the second li relative to the ul:

http://jsfiddle.net/thirtydot/TgXvp/

var position = $('li:nth-child(2)').position();

alert(position.top);
alert(position.left);