Matching a String and then incrementing a number within HTML elements
<p>I have tags in a html list, here is an example of two tags.</p>

<pre><code>&lt;div class="tags"&gt;
    &lt;ul&gt;
        &lt;li&gt;
            &lt;a onclick="tag_search('tag1');" href="#"&gt;tag1
                &lt;span class="num-active"&gt;1&lt;/span&gt;&lt;/a&gt;
        &lt;/li&gt;
        &lt;li&gt;
            &lt;a onclick="tag_search('tag2');" href="#"&gt;tag2
                &lt;span class="num-active"&gt;1&lt;/span&gt;&lt;/a&gt;
        &lt;/li&gt;
    &lt;/ul&gt;
&lt;/div&gt;
</code></pre>

<p>I would like to write a function that I can pass a string to, that will match the strings in the a hyperlink i.e. "tag1" or "tag2", if there is a match then increment the number in the span, if not then add a new li.</p>

<p>The bit I am having trouble with is how do I search for a string in the div with class tags and then when I find a match identifying the element. I can't even do the first bit as I am use to using an ID or a Class.</p>

<p>I appreciate any help on this using JQuery</p>

<p>Thanks all</p>

<h2>Code so far</h2>

<pre><code>function change_tag_count(item){

    alert(item);//alerts the string test

    $.fn.searchString = function(str) {
        return this.filter('*:contains("' + item + '")');
    };

    if($('body').searchString(item).length){

        var n = $('a').searchString(item).children().text();

        n = parseInt(n) + 1; 

        $('a').searchString(item).children().text(n);

    }else{
        alert('here');//does not alert this when no li contains the word test
        $("#all_tags ul").append('&lt;a onclick="tag_search(\''+item+'\');" href="#"&gt;'+item+'&lt;span class="num-active"&gt;1&lt;/span&gt;&lt;/a&gt;');    

    }

}
</code></pre>
