How can I retrieve the text of a clicked element using jQuery's .text property?

Question

I currently have a list of divs that all have unique text. I would like the website to display the value of the text inside the div that you just clicked in a different div. The thing is, this list is very long, and I do not have specific IDs for any values in the list. Is it possible to pull text from that list using `$(this).text`? I could not get it to work. HTML: ``` Facilities Management

Where do you live?

building 1

building 2

``` JQuery: ``` $(document).ready(function() { $('.buildings').mouseenter(function() { $(this)…

Accepted Answer

text() is a function, you need to invoke it to get the text of the clicked element

```
var $buildingName = $(this).text();// <-- () at the end
$('span').text($buildingName);
```

Your code can be rewritten as

```
jQuery(function ($) {
    //these selectors are executed only once
    var $span = $('#jstext');
    $('.buildings').hover(function () {
        $(this).css('background-color', '#D8BFD8');
    }, function () {
        $(this).css('background-color', '#F0EAD6');
    }).click(function () {
        var buildingName = $(this).text();
        $span.text(buildingName);
    });
});
```

Demo: Fiddle

How can I retrieve the text of a clicked element using jQuery's .text property?

Solution

Problem