how to push img file and url input with js

I'm trying to add a new item on an array that displays in a container on HTML. It's supposed to get an image file and an url from input, check the selected option and push each one to its specified array

Here is the relevant html:

<input type="file" name="comic-cover" id="comic-cover" required />
<input type="url" name="comic-url" id="comic-url" placeholder="url" required />

<select name="publisher-list" id="publisher">
                <option value="publisher" disabled>Publisher</option>
                <option value="dc">DC Comics</option>
                <option value="marvel">Marvel</option>
            </select>

<button type="submit" class="btn-submit">Add</button>

<h2 class="comic-publisher">DC Comics</h2>
        <div class="dc" id="block-dc">
        </div>

<h2 class="comic-publisher">Marvel</h2>
        <div class="marvel" id="block-marvel">
        </div>

and the js:

var comicCovers = ["imgs/Dark Knights of Steel-000.jpg", "imgs/Hawkeye-000.jpg"]
var trailers = ["https://www.youtube.com/watch?v=WspmgrmEgn4", "https://www.youtube.com/watch?v=ssj0P0uY08U"]
var publishers = [0, 1];
var i = 0;
var blockDC = document.querySelector("#block-dc");
var blockMarvel = document.querySelector("#block-marvel");

render()

var publisher = document.querySelector("select").value;
document.querySelector("select") = function renderPublisher() {
    publisher = document.querySelector("select").value;
    return publisher;
}

// add new comics to the list // 
document.querySelector(".btn-submit") = function addOnList() {
    var newCover = document.querySelector("#comic-cover");
    var newTrailer = document.querySelector("#comic-url");

    if (newCover.endsWith(".jpg") & newTrailer.startsWith("https://")) {
        if (publisher == "dc") {
            publisher.push(0);
        } else {
            publisher.push(1)
        }

        comicCovers.push(newCover.value);
        trailers.push(newTrailer.value);
        newCover.value = "";
        newTrailer.value = "";
        render()
    }
}


function render() {
    for (i; i < comicCovers.length; i++) {
        // creates the comic covers using js var //
        var comicCover = document.createElement("img");
        comicCover.setAttribute("src", `${comicCovers[i]}`);

        // creates trailer button //
        var trailerButton = document.createElement("button");

        //  //
        var container = document.createElement("div");
        container.setAttribute("class", "container");
        container.appendChild(trailerButton);
        container.appendChild(comicCover);
        blockDC.appendChild(container);
        trailerButton.appendChild(document.createTextNode("Trailer"));
        trailerButton.setAttribute("class", "trailer-button");
        trailerButton.setAttribute("onclick", `openTrailer("${trailers[i]}")`);

        if (publishers[i] == 0) {
            blockDC.appendChild(container);
        } else {
            blockMarvel.appendChild(container);
        }
    }
}

I tried to use if (newCover != "" & newTrailer != "") and even changed the input type from file to url. What am I doing wrong?