I need to programmatically trigger a click event that's being handled by jQuery. Here's the current code:

var $thumbs = $('#PhotoGalleryThumbs .tile');
var $zoom = $('#PhotoGallery #PhotoGalleryZoom img');
var $description = $('#PhotoGallery #PhotoGalleryDescription');

$thumbs.click(function(event) {
    event.preventDefault();
    var $thumb = $(this);
    $thumb.addClass('selected')
        .siblings().removeClass('selected');
    $zoom.attr('src', $thumb.children('a').attr('href'));
    $description.html($thumb.find('img').attr('alt'));
});

I am having a mental block working out how to create a function out of the event handling code and then arbitrarily calling it for an element in the $thumbs object.

I need to programmatically trigger a click event that's being handled by jQuery. Here's the current code:

var $thumbs = $('#PhotoGalleryThumbs .tile');
var $zoom = $('#PhotoGallery #PhotoGalleryZoom img');
var $description = $('#PhotoGallery #PhotoGalleryDescription');

$thumbs.click(function(event) {
    event.preventDefault();
    var $thumb = $(this);
    $thumb.addClass('selected')
        .siblings().removeClass('selected');
    $zoom.attr('src', $thumb.children('a').attr('href'));
    $description.html($thumb.find('img').attr('alt'));
});

I am having a mental block working out how to create a function out of the event handling code and then arbitrarily calling it for an element in the $thumbs object.

• javascript
• jquery
• events

2 Answers 2

$thumbs.click();

This would trigger the click event. Is this what you're looking for?

Similar to the previous suggestion of

$($thumbs[7]).click();

you can use

$thumbs.eq(7).click();

For clarification, array indexing into a jQuery collection gives you the DOM Element at that position, whereas .eq(n) gives you a new jQuery object which references only the indexed element.

http://api.jquery./eq/