Getting the current element in object Jquery

Its a bit difficult for me to explain this. I am using qtip to display tooltips on list items.

What I would like to do is show the content in the span with class "tooltip" as the text for tooltip.

I am trying this code however it return the text in all the span tags like this

"text for first item text for second item"

in all the tooltips.

** HTML Code **

<ul>
            <li>
                <span>list item first</span>
                <span class="tooltip">text for first item</span>
            </li>
            <li>
                <span>list item second</span>
                <span 开发者_如何学Cclass="tooltip">text for second item</span>
            </li>

        </ul>

Javascript Code

        $('ul li').qtip({
            content: $(this).find('span.tooltip').text(),
            show: 'mouseover',
            hide: 'mouseout'
        })

---

Use a .each() loop so you can reference the element as you run the plugin on it, like this:

$('ul li').each(function() {
  $(this).qtip({
    content: $(this).find('span.tooltip').text(),
    show: 'mouseover',
    hide: 'mouseout'
  });
});