Search code examples
jqueryjquery-selectorsdom-traversal

jQuery how to select elements not being .first() or .last()


I've got this code

        <ul>
            <li><a href="index.php">Web Development</a></li>
                <span data-landing_count="1">
                    <li class="subli"><a href="1.html">E-shop</a></li>
                    <li class="subli"><a href="2.html">Prezentations</a></li>
                    <li class="subli"><a href="3.html">Custom CMS</a></li>
                    <li class="subli"><a href="4.html">WordPress & Joomla!</a></li>
                    <li class="subli"><a href="5.html">Web apps</a></li>
                    <li class="subli lastsl"><a href="index-b.html">Design</a></li>
                </span>
            <li><a href="6.html">E-courses</a></li>
                <span data-landing_count="2">
                    <li class="subli"><a href="7.html">Design & Graphics</a></li>
                    <li class="subli lastsl"><a href="8.html">Web Development</a></li>
                </span>
            <li><a href="9.html">SEO</a></li>
                <span data-landing_count="3">
                    <li class="subli"><a href="91.html">On-page SEO</a></li>
                    <li class="subli"><a href="92.html">W3C validation</a></li>
                    <li class="subli"><a href="93.html">Linking</a></li>
                    <li class="subli lastsl"><a href="94.html"><img src="img/star.png" alt="star" width="12" class="star">Copywriting</a></li>
                </span>
            <li data-landing_count="4"><a href="95.html">Web hosting</a></li>
            <li data-landing_count="5"><a href="96.html"><img src="img/star.png" alt="star" width="12" class="star">Pricing</a></li>
            <li data-landing_count="6"><a href="97.html">Contact us</a></li>
        </ul>

There are 3 spans, I now i can target the first one by .first() and the last one with .last(). But how do I target the middle one?

Thanks for reply


Solution

  • You could use:

    $('span').eq(1);
    

    Using the eq() method, or the selector:

    $('span:eq(1)');
    

    Or:

    $('span').slice(1,-1);
    

    Note that your HTML is invalid, though: the only element that can wrap li elements is a ul or an ol.

    References: