Get to the child of parent, jquery

Question

I have this code:

<div class="Slideshow homeSlideshow"> <div class="jshowoff jshowoff-1" style="position: relative;"> <ul style="position: relative;"> <li class="Slide" title="Trailer" style="left: auto; right: 0px; top: auto; bottom: auto; position: relative;"> <a target="_blank" href="http://www.youtube.com/watch?v=123456" title="xxx"></a> </li> </ul> <p class="jshowoff-slidelinks jshowoff-1-slidelinks"> <a class="jshowoff-slidelink-0 jshowoff-1-slidelink-0" title="undefined" href="#null" style="width: 30.3333%;"> Trailer </a> </p> </div> </div>

And I'm in p class jshowoff-slidelinks. What I need, that on clicking the a inside of this p, I go to the href that's inside the li class slide.

Any idea?

It's like, go to the href to the child of parent, something of that sort.

Thing is, this is part of a slideshow code, and hence the li keeps changing as the slide moves.

it's a good idea to show your code, in this case it would be the javascript/Jquery code you are trying to make work! — Naryl
– Naryl, Commented Nov 22, 2012 at 16:49

Adil · Accepted Answer · 2012-11-22 16:56:10Z

Try this,

Live Demo

$('.jshowoff-slidelinks.jshowoff-1-slidelinks').click(function(){ alert($(this).closest('.jshowoff.jshowoff-1').find('li a').attr('href')); });

Diego · Accepted Answer · 2012-11-22 16:48:20Z

$("p a").click(function() { var div = $(this).parent().parent(), a = div.find("ul a"), href = a.attr("href"); window.location = href; });

Ohgodwhy · Accepted Answer · 2012-11-22 16:49:29Z

$('[class^=jshowoff-slidelink]').click(function(e){ e.preventDefault(); window.location = $(this).closest('.Slideshow').find('.Slide a').prop('href'); });

calling .parent() does not make use of querySelectorAll which has performance implications. .closest(), however, will, and has the better performance.

I've used class^ or class begins with incase you have multiple instances of that link. window.location will tell the browser to load the string provided after the = which in this case, is the anchor element within the .slide element. We simply took the href property from this anchor.

T.J. Crowder · Accepted Answer · 2012-11-22 16:49:54Z

I'd probably go with closest and find:

$("p.jshowoff-slidelinks").click(function() { var href = $(this).closest("div.Slideshow").find("li.Slide a").attr("href"); if (href) { window.location = href; } return false; });

Sridhar Narasimhan · Accepted Answer · 2012-11-22 17:08:54Z

Bind the event for click and in the event get the element and check for parent and find the anchor tag that is desired

 var p = $("p.jshowoff-slidelinks"); p.click(function(){ window.location = $(this).parent().find("ul>li>a").attr("href"); });

Check the below jsfiddle

http://jsfiddle.net/LSwvG/3/

Use Window.loaction to redirect

Thanks

Collectives™ on Stack Overflow

Get to the child of parent, jquery

5 Answers 5

Comments

Comments

Comments

Comments

Comments

Hot Network Questions

Collectives™ on Stack Overflow

5 Answers 5

Comments

Comments

Comments

Comments

Comments

Related