Как я могу применить функцию к нескольким изображениям в jQuery?

Question

Мне нужна небольшая помощь с (возможно) чем-то действительно простым.

Я хочу использовать скрипт, который преобразует изображения из цветного в оттенки серого.Я получил его частично - первое изображение становится серым, а второе - нет.

Я знаю, это потому, что идентификатор нельзя использовать несколько раз:

var imgObj = document.getElementById('grayimage');

Я пробовал это:

var imgObj = $(’.grayimage’)[0];

Но это не сработало.Изменение его на getElementByClass также не работает.(Прежде чем люди спросят, я изменил id на класс в теге <img>.)

Я действительно мог бы использовать некоторую помощь здесь.Заранее спасибо!

Answer 1

$ ('. Grayimage') дает вам список всех элементов с классом grayimage. Если вы добавите «[0]», вы получите доступ к первому элементу, поэтому любые сделанные вами изменения будут применены только к первому изображению, которое он найдет в этом классе.

Вы должны пройти через все элементы:

var images = $('.grayimage');
for(i = 0; i < images.length; i++) {
   var image = images[i];

   // Do stuff
}

Answer 2

$('.grayimage').each(function(idx,imgObj){
    <do your code here>
});