How can I get the text of a hidden element in Jquery?

Question

I have the following css and html...

.hide
{
 display:none;  
}

<div>
    <span class='kardashian hide'>Kimmy</span>
</div>

with the following jquery.

$('div').live('click', function(){
   alert($('kardashian', this).val());
});

If I remove the "hide" class I get "Kimmy" like I would expect but when it has the "hide" class I get nothing? How can I get the text of a hidden element in Jquery?

Answer 1

You just need a proper .class selector and .text() (.val() is for inputs), like this:

$('div').live('click', function(){
   alert($('.kardashian', this).text());
});

The visibility of the element doesn't really affect anything, it'll work whether it's hidden or not.

Answer 2

Use .text() instead:

alert($('.kardashian', this).text());

The .val() method is used to get the value property of form inputs.