title: Jquery changing div text value upon clicking on li items
body: <p>I am building a theme selector for maps and want to reflect the currently selected theme.</p>
  
  <p>The code seems to work but never returns the value of the "li" item, it always returns "s-thumbs" for whatever "li" item I click on. I tried using the .closest() method but to no avail.</p>
  
  <p>I'm following <a href="http://www.learningjquery.com/2009/09/working-with-events-part-3-more-event-delegation-with-jquery" rel="nofollow">this article.</a></p>
  
  <pre><code>    &lt;script language="javascript"&gt;
      $("ul.s-thumbs").live("click", function(event) {
        $("#theme_title").text(
            $(this).closest("ul.s-thumbs li").attr("class")
          );
       });
      &lt;/script&gt;
  
  
      &lt;div id="theme"&gt;You have selected the &lt;div id="theme_title"&gt;&lt;/div&gt; Theme&lt;/div&gt;
          &lt;div class="container_16" id="themebg"&gt;
          &lt;!--&lt;div class="grid_1"&gt; &lt;a href="" "img" src="/styles/image/leftarrow.png" id="leftarrow" alt=""/&gt;&lt;/div&gt;--&gt;
          &lt;div class="grid_16 slider-wrapper"&gt;
          &lt;ul class="s-thumbs"&gt;
                      &lt;li class="Default"&gt; &lt;a href="javascript:setRoadmap()"&gt;&lt;img src="/styles/image/thumbs/default.png" alt="" /&gt;&lt;/a&gt;Default&lt;/li&gt;
                      &lt;li class="Hatchery"&gt; &lt;a href="javascript:setGreen()"&gt;&lt;img src="/styles/image/thumbs/hatchery.png" alt="" /&gt;&lt;/a&gt;Hatchery&lt;/li&gt;
  &lt;/ul&gt;
  &lt;/div&gt;
  </code></pre>