ie和firefox中列表选择的不同行为？

Question

<ul id='reorderps'>
<li><span><a href=''>+</a>Item 1</span></li>
 <ul>
   <li><span><a href=''>+</a>Sub Item 1</span></li>
   </ul>
 </ul>

I have a unordered list like this with level 1 and level 2 items when i am trying to do a

jQuery('a').parent().parent().html(); it is behaving differently in ie. In IE it is taking ul below it as its child but in mozilla it isnt. What can be the cause and solution to it.

Answer 1

I've tested in IE & Firefox, and in both it take same` +Item 1

Also you have missed brackets with first parent,I've tested like this for example

$("#reorderps").append(jQuery('a').parent().parent().html());

And in result I have this in both browsers

+Item 1
+Sub Item 1
+Item 1

Here is jsfiddle http://jsfiddle.net/sUxyt/1/

Why Item 1?Because jQuery('a') returns array to you, and jQuery('a') means jQuery('a').eq(0)

If you want to take next line you must write something kind of this

$("#reorderps").append(jQuery('a').eq(1).parent().parent().html());

In this situation you must get this in example of my jsfiddle

+Item 1
+Sub Item 1
+Sub Item 1

EDIT:

I change Javascript part as you want,like this

jQuery('ul#reorderps a').click(function(e){ alert(jQuery(this).parent().parent().html()); e.preventDefault(); });

And yeah, there is a difference in IE 7 & other browsers. All is need to change your html from this

<ul id='reorderps'>
<li><span><a href=''>+</a>Item 1</span></li>
 <ul>
   <li><span><a href=''>+</a>Sub Item 1</span></li>
   </ul>
 </ul>

to

<ul id='reorderps'>
<li><span><a href=''>+</a>Item 1</span></li>
    <li>
 <ul>
   <li><span><a href=''>+</a>Sub Item 1</span></li>
   </ul>
    </li>
 </ul>

The reason of that behavior is that IE 7 doesn't recognize the end tag of your li, and take the innerHTML of your li little bit larger. Adding li to second part solve the problem:)