jQuery click child element

Question

I have this list browse plugin with next & prev button

HTML :

<ul>
  <li><a href="http://www.google.com/">Google</a></li>
  <li><a href="http://www.yahoo.com/">Yahoo</a></li>
  <li><a href="http://www.aol.com/">Aol</a></li>
</ul>

<input type="button" class="prev" value="< Prev" />
<input type="button" class="next" value="Next >" />

JQUERY :

(function(){
    var $lis  = $('ul li'),
        index = 0;

    function li_click(){
        lastIndex = index;
        index = $(this).index();
        $lis.eq(index).addClass('active');
        $lis.eq(lastIndex).removeClass('active');
    }

    $lis.click(function () {
        $lis.eq(index).removeClass('active');
        index = $(this).index();
        $lis.eq(index).addClass('active');
    }).eq(0).addClass('active');

    $('.next, .prev').click(function () {
        $lis.eq(index).removeClass('active');
        if ($(this).hasClass('prev')) {
            index--;
            if (index < 0) {
                index = ($lis.length - 1);
            }
        } else {
            index++;
            if (index >= $lis.length) {
                index = 0;
            }
        }
        $lis.eq(index).addClass('active');
    });
})();

Here is Fiddle

This plugin works fine. But I want to trigger its child element ('a') on clicking next/prev buttons

for example, I click on next button & move to Yahoo then I want its child ('a') to get clicked. same thing goes with prev button. I want to trigger child element ('a') of newly added parent class ('.active')

How can I achieve this ?

Carsten · Accepted Answer · 2012-02-16 08:20:26Z

1

This should work:

$(".active > a").trigger("click");

answered Feb 16, 2012 at 8:20

Carsten

18.5k4 gold badges51 silver badges56 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

Carsten Over a year ago

Well it does work. The reason why you don't see anything happening is because in your code, you don't have any events attached to the onclick event of the a elements. If you want to follow that link when pressing prev/next, you want to do this: window.location.href = $(".active a").attr("href");

MANnDAaR Over a year ago

I have added onclick event here : jsfiddle.net/Rtmdj/29 But it still not working...

Carsten Over a year ago

No, of course your script doesn't work. There is no .active element when the script runs, so your onclick event will not attach to anything. Here, try this one: jsfiddle.net/Rtmdj/30

Sebastian Popa · Accepted Answer · 2012-02-16 08:18:10Z

0

I think this should do it:

$lis.eq(index).addClass('active').find('a').trigger('click');

answered Feb 16, 2012 at 8:18

Sebastian Popa

981 silver badge7 bronze badges

Collectives™ on Stack Overflow

jQuery click child element

2 Answers 2

3 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

3 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related