How do I get the span text within the list item using jQuery?
<p>I have t he following list item:</p>

<pre><code>&lt;li class="item" id="44"&gt;
  &lt;div class="name"&gt;Bogstadveien&lt;/div&gt;
  &lt;div&gt;
    &lt;span class="city"&gt;Oslo&lt;/span&gt;, 
    &lt;span class="country"&gt;Norway&lt;/span&gt;
  &lt;/div&gt;
&lt;/li&gt;
</code></pre>

<p>Upon clicking the list item, I run the script:</p>

<pre><code>var list_item = jQuery(this);
var guide_id = list_item.attr('id');
</code></pre>

<p>How do I get the city and country values?<br>
I've tried using <code>find</code>, <code>closest</code> and <code>next</code>, but I'm not using them correctly.</p>
