Search code examples
jqueryjquery-selectorselement

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


Solution

  • 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) { …… }