jQuery click function for <ul><li> elements
<p>I have a unordered list looking like this:</p>

<pre><code>&lt;ul id="frozen" data-name="nameOfSelect" class="tagit"&gt;
   &lt;li class="tagit-choice" tagvalue="2" style="padding-right: 4px;" id="tag-2"&gt;
      &lt;div class="tagit-label" data-value="2"&gt;kázeň&lt;/div&gt;
   &lt;/li&gt;
   &lt;li class="tagit-choice" tagvalue="1" style="padding-right: 4px;" id="tag-1"&gt;
      &lt;div class="tagit-label" data-value="1"&gt;žalmxxxx&lt;/div&gt;
   &lt;/li&gt;
&lt;/ul&gt;
</code></pre>

<p>I need to bind an click function to all of them and get the data of the <code>id="tag-1"</code> to be used in the function. </p>

<p>I have tried this:</p>

<pre><code>$('#[id|="tag"]').each(function(){
    var tag = this.attr('id'); 
    var tagID = tag.replace('tag-',''); 
    this.click(function (){
       alert('index.php?s=taglist&amp;tag=' + tagID);
       //window.location = string;
    });
});
</code></pre>

<p>However, for some reason it seems that this approach is wrong for the <code>&lt;li&gt;</code> element as I am having problems with the selector (it seems). Maybe I am also missing something stupid... Any ideas?</p>
