Question

I have code like this:

<div id="item-menu">
  <ul style="padding-top: 10px; padding-left: 20px;">
    <li id="item-1">1</li>
    <li id="item-2">2</li>
    <li id="item-3">3</li>
  </ul>
</div>

I want to get each item position relative to the container. In this example I will get each <li> position relative to the <ul>, right?

What should I do to get position of item-1 –> top: 10, left: 20?

Answer 1

You have to add the style position:relative for your

  <ul style="position:relative;   padding-top: 10px; padding-left: 20px;">

then

$('#item-menu ul li').each(function(){
    console.info( $(this).position());
});