Find & Replace Specific DIV With jQuery

I have a page I am working with that has several hidden DIVs that are identically formatted, but the content within each DIV varies. I want to be able to seek out a specific DIV (based on it's content), unhide it, and replace it with custom content.

For instance, I have:

<div class="caption" style="display:none">[ProductDetail_Espot]</div>

And I want:

<div class="caption" style=""><p&g开发者_运维百科t;My Custom Content</p></div>

I have looked at a couple regex scripts and stuff, but I'm not a genius when it comes to scripting, so any help would be appreciated!

If you know that only one div has this content, then you can use the :contains ^[docs] selector:

$('.caption:contains("[ProductDetail_Espot]")')
   .html("<p>My Custom Content</p>")
   .show();

$(function(){
    $(".caption:contains('Espot')).show().html('<p>My custom content</p>');
});

demo: http://jsfiddle.net/EsPym/1/

Some simple jQuery to get you going...

$("#caption").show();

will show it,

$("#caption").html("<p>some html</p>");

will replace contents.

$("#[ELEMENT ID]").click(function(){
$(".caption").show().html('[YOU NEW ACCONT]');
})