Динамическое добавление html элементов с подвязкой к ним js функций

Дано: проект на asp.net mvc,представление -

<tbody id="getNewRowTable">
    @* Далее динамичная часть таблицы *@
    <tr>
        <td>
            <input type="text" class="input-vertical-symbols" value="1" />
        </td>
        <td>
            <input type="text" class="input-vertical-symbols" value="1 2 3 4" />
        </td>
        <td>
            <textarea class="textarea-style">Биллетировать d900.Закатать цапфу.Отрубить поддон.Произвести 2 замера и занести в МКК.
            </textarea>
        </td>
        <td colspan="2">
            <div>
                <!-- alt картинок должен совпадать с value в селекторе, чтобы картинки выводились нужные. -->
                <div id="change_img_car">
                    <img src="/Img/sketches/VarTexProcessImages/Билетир1.png" alt="Biletir1">
                    <img src="/Img/sketches/VarTexProcessImages/Билетир2.png" alt="Biletir2">
                </div>
                <br />
                <span>Размер 1</span>  <input type="number" value="" /> <br />
                <span>Размер 2</span>  <input type="number" value="" /> <br />
                <select class="list_car">
                    <option checked="checked" value="Biletir1">Билетир1</option>
                    <option value="Biletir2">Билетир2</option>
                </select>
                <button onclick="getImage()">Показать эскиз</button> <!-- Принудительно вызываем скрипт -->
                <button style="float:right" onclick="getNewImage()">Добавить эскиз на операцию</button>
                <br />
                <br />
                <div id="divImage"></div>
                <br />
            </div>
        </td>
        <td>
            <select>
                @*номера пресса*@
                <option checked="checked" value="0">-</option>
                <option value="1">1</option>
                <option value="2">2</option>
                <option value="3">3</option>
                <option value="4">4</option>
                <option value="5">5</option>
                <option value="6">6</option>
            </select>
        </td>
        <td>
            <textarea class="textarea-style">Бойки В-плоский, Н-вырезной, Нож</textarea>
        </td>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
        <td>
            <input type="text" style="field-sizing: content;" />
        </td>
        <td>
            <select>
                @*разряд работ*@
                <option checked="checked" value="0">-</option>
                <option value="1">1</option>
                <option value="2">2</option>
                <option value="3">3</option>
                <option value="4">4</option>
                <option value="5">5</option>
                <option value="6">6</option>
            </select>
        </td>
    </tr>
</tbody>

....

    <div id='divTable'></div> <!-- Сюда динамически вставляется табличка через кнопку  -->
<br />
<button onclick="getNewRow()">Добавить строку таблицы</button>

Скрипт динамического добавления строки у таблицы:

async function getNewRow() {

    const divFerma = document.getElementById('divTable');
const idx = numFilters++;
const div = document.createElement('div');
const btn = document.createElement('button');
let row = document.createElement('tr');

row.innerHTML =
    '<td><input type="text" class="input-vertical-symbols"/></td>' +
    '<td><input type="text" class="input-vertical-symbols"/></td>' +
    '<td><textarea class="textarea-style"></textarea></td>' +
    '<td colspan="2"><img src="/Img/sketches/VarTexProcessImages/PosadkaSlitka.png" alt="PosadkaSlitka"><select class="list_car"></select></td>' +
    '<td><select></select></td>' +
    '<td><textarea class="textarea-style"></textarea></td>' +
    '<td></td>' +
    '<td></td>' +
    '<td></td>' +
    '<td></td>' +
    '<td><input type="text" style="field-sizing: content;"</td>' +
    '<td><select></select></td>';

const article = document.getElementById("getNewRowTable");// находим по id динамич. часть таблицы  в <tbody....
//const lastTR = article.lastElementChild; // получаем последний элемент
//const newlastTR = lastTR.cloneNode(true); // клонируем элемент lastP
btn.innerHTML = `Удалить строку ${idx}`;
// Создаем событие нажатия на кнопку
btn.addEventListener('click', () => {
    div.remove();
    row.remove();
})
div.appendChild(btn);
divFerma.appendChild(div);
    article.appendChild(row); // добавляем в конец элемента article
}

Скрипт динамического обновления картинки через select:

var numFilters = 2;// 2 - потому что первая уже есть, номер добавляемой строки, отображается на созданой кнопке в ф-ии getNewRow()

async function getImage() {
    ///// Скрипт работы выпадающего списка 
    let selCar = document.querySelector('.list_car'); // Берём селектор
    let viewCar = document.querySelector('#change_img_car'); // и берём блок в котором находятся картинки авто

    // Проверяем какой option выбран, изначально будет первый, его и отобразим
    viewCar.querySelector(`[alt="${selCar.value}"]`).classList.add('--show');

    // Вешаем обработчик на изменение `option`
    selCar.addEventListener('change', function (e) {
        viewCar.querySelector('.--show').classList.remove('--show'); // Удаляем класс с выбранной ранее картинки
        viewCar.querySelector(`[alt="${e.target.value}"]`).classList.add('--show'); // И вешаем новый, который есть у выбранного option
    });
    ///// Скрипт работы выпадающего списка
}

При нажатии на кнопку "Показать эскиз", у нас срабатывает скрипт динамического обновления картинки через select: (рис1)

Пока что всё работает проблем нет) Далее, при нажатии на кнопку "Доб строку таблицы" срабатывает Скрипт динамического добавления строки у таблицы:

И вот тут начинаются проблемы:

1. Как мне заставить работать в динамически добавленной строке select? Понятно что у нас идёт подвязка div, где обновляются картинки, через id, и js видит первый элемент с указанным id="change_img_car" и всё... с ним он и работает.

Что я пытался: изменил id на класс-селектор, и в js тоже ввёл соответ изменения, и код ломается ничего не работает , код брал от сюда

Как поместить выбранное изображение в Div по изменению значения option класса Select?

Перебрал все варианты, ничего не получилось, лучше вообще этот код не трогать.

Так как мне сделать реализовать функционал чтобы и динамически добавленные картинки менялись? (сейчас в динамику просто доб-ся картинка-заглушка, для наглядности)

2. Имеется ли смысл переделать всю эту фичу на частичные представления? хотя тогда js точно не получиться подвязать....