Background color set up for dynamically added content via AJAX

I have problem with setting of background color for li elements dynamically added by AJAX.

I cannot use pure css, because it marks also new added item at the end of list.

I tried this solution at the end of code but it is still not working. When I add or delete item via AJAX background color settings will disappear.

$(document).ready(function() {
    listItems.eq(0).css({backgroundColor: '#441515'});
    listItems.eq(1).css({backgroundColor: '#442415'});
    listItems.eq(2).css({backgroundColor: '#443a15'});
});
$(document).ajaxComplete(function(){
    listItems.eq(0).css({backgroundColor: '#441515'});
    listItems.eq(1).css({backgroundColor: '#442415'});
    listItems.eq(2).css({backgroundColor: '#443a15'});
});

Here is jquery part of code:

/*
DELETE ITEM VIA AJAX
*/

// event listener must be attached to todoapp__list which is out of block changed by ajax
todoList.on('click', '.todoapp__list-delete', function(event) {
event.preventDefault();

var stringId = $(this).attr('href');
    id = stringId.substring(stringId.indexOf('=') + 1, stringId.indexOf('&') ); // get id number of deleted item from href with url directed to delete-item.php
    // id is between first = and first & in url string

// Dialog window confirmation if we want to remove item
var confirmDelete = confirm('Chcete danu polozku naozaj vymazat?');

// if click on yes, then AJAX
if (confirmDelete == true) {

    $.ajax({
        url: "_inc/delete-item.php", // get url form action parameter of form add-item
        type: 'POST', // send data via POST method
        dataType: 'json', // received data in format JSON
        data: 'id=' + id  // posiela data namiesto formulara z html => data to be sent to the server. If the HTTP method is one that cannot have an entity body, such as GET, the data is appended to the URL.
    }).done(function (data) {
        if (data.status === 'success') { // check if add-item.php show success for process of data insertion to table
            // get index.php with actual list of li and append last to end of list
            $.ajax({ url: baseURL, }).done(function(html) {
                var newList = $(html).find('.todoapp__list-items');
                    currentList = $('.todoapp__list');

                currentList.html(newList);
            });
        };
    });
};

});

Here is HTML code:

        <ul class="todoapp__list">
            <?php
                if ( ! empty($data) ){
                    foreach ( $data as $item ) {
                        echo '<li id="item-' . $item['id'] . '" class="todoapp__list-items"><span class="editable-span">' . $item['text'] . '</span>';
                        echo '<div class="todoapp__list-controls float-right">';
                        echo '<a href="edit.php?id=' . $item['id'] . '&form-name=edit"class="todoapp__list-edit">edit</a>';
                        echo '<a href="delete.php?id=' . $item['id'] . '&form-name=delete"class="todoapp__list-delete"><i class="fas fa-times"></i></a>';
                        echo '<a href="transfer-item.php?id=' . $item['id'] . '"class="todoapp__list-status"><i class="fas fa-check-circle"></i></a>';
                        echo '<a href="" class="todoapp__list-order"><i class="fas fa-sort"></i></a>';
                        echo "</div></li>";
                    };
                } else {
                    echo '<span>there are no tasks on your toapp</span>';
                };
            ?>
            </ul>

Thank you