Change 'P' tag text color within a div element

Question

How do I change the p tag text color css attribute using jQuery? I don't want to change all p tags, just a particular one....

Is this possible without adding an id for every p tag?

<div class = "custimage"><img src = "img/notch.jpg" alt = "notch"/><p>Notch</p></div>
<div class = "custimage"><img src = "img/peak.jpg" alt = "peak"/><p>Peak</p></div>
<div class = "custimage"><img src = "img/shawl.jpg" alt = "shawl"/><p>Shawl</p></div>

EDIT:

I want it so that when the user clicks on a particular custimage, the p tag text color is changed. I have tried:

$('.custimage').click(function(e) {
               var cssObj = {
                  'background-color' : '#fff'
               }
               $(this).css(cssObj);
               $('this p').css({color: '#000'});
});

This doesn't work. Using $('.custimage p').css({color: '#000'}); changes the colour of the text in all the images...

Answer 1

You should be able to change the color of the p tag inside the clicked .custimage div like this:

$('.custimage').click(function(e) {
    $(this).find('p').css({color: '#000'});
});

The .find() function traverses down the DOM tree to find any tag that matches the given selector. You can read more about the .find() function at http://api.jquery.com/find/

Answer 2

$(".custImage p") would get you all p tag's within a div with that class. You could then do what you want. If you give me more information I'll give you a better selector.

Answer 3

To change a specific 'p' using text contents as a selector -

$("p:contains('Notch')").css("color","red");

to get the one inside the div with class .custimage that was clicked -

$('.custimage').click(function(e) {$(this).find('p').css("color","red")});

Answer 4

$('p').each(function(index) {
    //Lets say you want to target P number 2
    if(index = "2")  {
        $(this).css('color','red');
    }
});

or you could target the image or alt tag.. would that work for you?