select parent followed by a different child
I am trying to make a script which when an object is clicked on highlights a specific child of that objects pearent
here is my code
HTML
<div id="sam">
<p>This be a paragraph block</p>
<p>This be a paragraph block</p>
<p>This be a paragraph block</p>
<p>This be a paragraph block</p>
</div>
CSS
.highlight{
background:yellow;
}
Jquery
$('p').click (function() {
$(this).parent(nth-child(1)).toggleClass('highlight');
});
});
This is a learning exercise for me so i cant just take some shortcut
It has to be one of the P objects which is clicked on
The targeted P oject has to be found by virtue of it being a specific child of the clicked P objects pearent (this could be the clicked P object or one of the others)
As you can see i have used This to target the clicked object
followed by .parent to move to the pearent
then nth:child() to select the child object i want to run code on
This code is not working
Why is this, i know that i am close
also
How would i go about finding out which child of its pearent the (this) object is
(so for example if i clicked on the first child i would want to get the value 0)