views:

187

answers:

3

Can't understand why this code changes color of DIV element to blue, but doesn't change color of a SPAN element. Any ideas?

<html>
<head>
  <script src="http://code.jquery.com/jquery-latest.js"&gt;&lt;/script&gt;
  <script>
    $(document).ready(function(){
      $("#prev ~ div").css("color", "blue");
      $("#prev ~ span").css("color", "red");
    });
  </script>
</head>
<body>
  <span id="prev">span#prev</span>
  <div>div sibling</div>
  <span>span sibling</span>
</body>
</html>

Noticed what if I replace

<span id="prev">span#prev</span>

with

<p id="prev">span#prev</p>

both DIV and SPAN change text color.

Thanks!

+2  A: 

Seems to be an error with JQuery. You should submit this bug to the team and let them fix it.

Eric Ryan Harrison
+4  A: 

This does indeed seem to be a bug. Report a bug to jQuery.

http://dev.jquery.com/report

There are a decent number of sibling selector bugs it seems.

altCognito
I have submitted the problem (http://dev.jquery.com/ticket/4605). Hope they will fix it soon.
Alexander Prokofyev
+6  A: 

Looks like you found a bug.

$("#prev ~ span:not(#prev)") works, as does $("#prev").siblings("span").

Paul
+1 for the workaround :)
altCognito
Also, $("#prev~span") works in 1.2.6 so it is definitely a bug introduced in 1.3.
DrJokepu