CODEWITHSUNDEEP
jqueryjquery-selectorselement
hh54188
hh54188

Reputation: 15626

how to judge an element's previous or next element exist with jquery?

suppose I have an <ul> :

<ul>
    <li></li>
    <li></li>
    <li class="test"></li>
</ul>

How can I judge the .test have its next element with jquery ? like this?:

if ($("li.test").next()) { …… }

the strange thing is that ,even I write like above:

if ($("li.test").next()) {alert("true");}

it still alert "true",but as you see,there is no element next to it ?why this happened?

Or what I can do is 

        for (i = 0; i < $("li").length; i++) {
            if ($("li").eq(i).hasClass("test")) {
                if (i == $("li").length - 1) {
                    alert("true");
                }
            }
        }

presently this could solve my problem,but is there a easy way?

thank you

Upvotes: 18

Views: 19711

Answers (4)

Headshota
Headshota

Reputation: 21449

$("li.test").next().length;

Example

Upvotes: 2

lonesomeday
lonesomeday

Reputation: 237845

A jQuery selection will always evaluate to boolean true (as in an if statement). This is because it is not a native Javascript type -- it is an object.

You need to check the length property of the selection. If it is empty, this will be 0 and will evaluate to false, so the if will not pass. If it is not empty, it will be a positive integer and will therefore evaluate to true, so the conditional will pass.

if ($("li.test").next().length) { …… }

Upvotes: 42

JohnP
JohnP

Reputation: 50019

You need to check the length property.

if ($("li.test").next().length) {
  //has next 
} else {
  //last elem
}

Keep in mind that jQuery usually returns itself so you can chain. Getting the length property of that object will give you the information

Upvotes: 1

Alex Wayne
Alex Wayne

Reputation: 187014

if ($("li.test").next().length > 0) { ... }

http://jsfiddle.net/Kfsku/

Upvotes: 7

Related Questions