How to select all images without the first one?

javascript, jquery

Solution

Raw JavaScript

The raw JavaScript version uses `document.getElementById` and `Element#getElementsByTagName` and then skips the first one:

var list, images = [], index;
list = document.getElementById("myGallery0").getElementsByTagName("img");
for (index = 1; index < list.length; ++index) {
    images.push(list[index]);
}
// Use the `images` array

Starting the loop with `index = 1` skips the first one (which would be `index = 0`).

Or you can get really tricky, but I'd test it thoroughly on your target browsers:

var images = Array.prototype.slice.call(
    document.getElementById("myGallery0").getElementsByTagName("img"),
    1);

That works because according to the specification, `Array.prototype.slice` must allow the object it's working with to be something other than an array, as long as it supports the operations listed in the specification for the `slice` method. And the `NodeList` returned by `getElementsByTagName` does, so we can call `slice` passing it the `NodeList` as the `this` value and telling it we want a slice starting with index 1. But note that the spec also quite clearly says "...Whether the `slice` function can be applied successfully to a host object is implementation-dependent." and `NodeList` is a host-provided object, hence the recommendation to test thoroughly in your target environments.

jQuery

In jQuery, there are lots of ways to do it. My favorite would probably be the one Rui pointed to, using `slice`:

var images = $("#myGallery0 img").slice(1);

Problem

Original source