Как обновить мой список без обновления страницы?

Question

Я реализовал простую программу, известную как foodlist, которая является списком массивов.Раньше я добавлял продукты в список через ajax.Все отлично работаетно я хочу обновить элементы списка, когда я вставляю элементы питания в массив.Это мой файл app.js

app.post('/add', (req, res) => {
    console.log(req.body.item); 
    foods.push(req.body.item);
    console.log(foods);
    res.render('index',{order:foods});
});

index.ejs

<form >
    <input type="text" name="game" id="title">
    <input type="submit">
</form>

<span id="succ_msg"></span><br>

<% if(typeof order !== "undefined") {
    for (var i = 0; i< order.length; i++) { %>
    <div id="champ">
        <span><%= order[i] %></span>
    </div>
<% } }%>

<script>
$(document).ready(function() {
    $('form').on('submit', function(e) {
        e.preventDefault();
        var title = $('#title').val();
        $.ajax({
            method: 'POST',
            url: '/add',
            data: {
                item: title
            },
            success: function(result) {
                $('#title').val("");
                $('#succ_msg').html("Success");
                setInterval(function() {
                    $('#champ').load() //here is my problem
                }, 1000);
            },
            error: function() {
                console.log('Error');
            }
        });
    });
});
</script>

Любые идеи