Question

I have a code

like

<ul id="uploadedfiles">
   <li>
       A_001
   </li>
   <li>
       B_001
   </li>
</ul>

Now i want to insert a new li but i want to check that something that whether a li with a text say A_ exist in that ul. If it exists than remove the older and add the new li.

Say if i add C_001 it is added with no issue

But if i add A_002 then it replace the A_001 with A_002.

Please provide the code for the same if possible.

Any help is appreciated!

Added:

The real data in li have text like control20_a.jpg , control21_b.jpg …..
Then when adding a new li say control20_c.jpg the code must replace control20_a.jpg. But add a new li if it does not exists

Answer 1

This is probably not very idiomatic jQuery, but it seems to do the job.

Working Example

var add = function(entry) {
    var match = $('#uploadedfiles li:contains(' + entry.slice(0, entry.indexOf('_')) + ')');
    if (match.length > 0) {
        match.text(entry);
    } else {
        $('#uploadedfiles').append($('<li>' + entry + '</li>'));
    }
}