Dynamically adding images to a form js+html

Dynamically adding images to a form js+html

 <!--upload-->
                    <div id="file" class="uk-margin registration-form__group--f">

                        <label class="uk-form-label text-insert"
                               for="form-check-the-product">Фото <span>
                                (<psevdo id="counter">0</psevdo> из 15)
                            </span></label>

                        <div class="file-container">

                            <div class="uk-form-controls margin-b">

                                <div uk-form-custom>

                                    <input type="file" accept=".jpg, .jpeg, .png">
                                    <img src="/img/upload.png" class="lazy" alt="upload">
                                </div>
                            </div>
                        </div>

                    </div>
                    <!--upload ------------------------------------------>




<script>

        let ImageFile = (function () {

            let counter = document.querySelector('#counter');
            let fileBox = document.querySelector('#file .file-container');
            let insertImg = 0;

            function run() {
                let inputFile = fileBox.querySelectorAll('input');
                let i;
                let rez = inputFile.length;
                let close = fileBox.querySelectorAll('a.file-btn-close');
                let a;
                let r = close.length;

                for (i = 0; i < rez; i++) {
                    inputFile[i].addEventListener('change', updateImageDisplay);
                }

                if (close) {

                    for (a = 0; a < r; a++) {
                        close[a].addEventListener('click', deleteImage);
                    }
                }
            }

            function deleteImage(e) {
                insertImg = insertImg - 1;
                this.parentNode.parentNode.remove();
                counter.innerHTML = insertImg;
            }

            function updateImageDisplay(e) {



                let file = this.files[0];
                let images = this.nextElementSibling;


                const template = document.createElement('div');
                template.classList.add("uk-form-controls", "margin-b");
                template.innerHTML = "<div uk-form-custom class='uk-form-custom'>" +
                    "<input type='file' accept='.jpg, .jpeg, .png'>" +
                    "<img src='/img/upload.png' class='lazy' alt='upload'>\n" +
                    "</div>";

                const button = document.createElement('a');
                button.classList.add("file-btn-close", "uk-close-large");
                button.setAttribute('uk-close', '');


                let reader = new FileReader();

                console.log(this.nextElementSibling);

                if(this.nextElementSibling.classList.contains("insertImg")){
                    var boolean = false;
                }

                setTimeout(func, 200);

                function func() {
                    if (file !== undefined) {

                        reader.readAsDataURL(file);

                        reader.onload = function (e) {


                                if(boolean === false){

                                    images
                                        .setAttribute('src', this.result);
                                }else {

                                    if (insertImg > 2) {

                                        alert('Достигнуто максимальное количество фотографий!!!');

                                    } else {

                                        images
                                            .setAttribute('src', this.result);

                                        insertImg = insertImg + 1;

                                        images
                                            .style.cssText = "background: white;" +
                                            "border: 1px solid #e5e5e5;" +
                                            "width: 200px;";

                                        images.classList.add("insertImg");

                                        images.parentNode.appendChild(button);

                                        fileBox.appendChild(template);


                                        counter.innerHTML = insertImg;

                                        alert('Добавлена фотография: (' + insertImg + ' из 15 )');
                                    }

                                }

                            run();
                        }
                    }
                }

            }
            return {
                handler: function () {
                    run();
                }
            }

        })();

        ImageFile.handler();

    </script>