title: Select value of nested element
body: <p>I have nested elements:</p>
  
  <pre><code>&lt;ul class="level-1"&gt;
    &lt;li class="item-i"&gt;I&lt;/li&gt;
    &lt;li class="item-ii"&gt;II
      &lt;ul class="level-2"&gt;
        &lt;li class="item-a"&gt;A&lt;/li&gt;
        &lt;li class="item-b"&gt;B
          &lt;ul class="level-3"&gt;
            &lt;li class="item-1"&gt;1&lt;/li&gt;
            &lt;li class="item-2"&gt;2&lt;/li&gt;
            &lt;li class="item-3"&gt;3&lt;/li&gt;
          &lt;/ul&gt;
        &lt;/li&gt;
        &lt;li class="item-c"&gt;C&lt;/li&gt;
      &lt;/ul&gt;
    &lt;/li&gt;
    &lt;li class="item-iii"&gt;III&lt;/li&gt;
  &lt;/ul&gt;
  </code></pre>
  
  <p>How to get value (it's '1') from <code>li class="item-1"&gt;1&lt;/li&gt;</code> when clicked? I have problem with defining right selector... How to end with something like this:</p>
  
  <pre><code>$(all children of level-1).click(function() {
      alert($(this.item-1").val(););
  }
  </code></pre>