Display Image Before Uploading

<div>

    <input type="file" name="partner_logo" id="partner_logo" class="form-control"  onchange="previewImage(event);" /><br/>
    <span id="msg" style="color:red"></span>
    </div>

     <div class="preview">
        <img id="preview-selected-image" />
    </div>

<script>

const previewImage = (event) => {
    const imageFiles = event.target.files;
    const imageFilesLength = imageFiles.length;
    if (imageFilesLength > 0) {
        const imageSrc = URL.createObjectURL(imageFiles[0]);
        const imagePreviewElement = document.querySelector("#preview-selected-image");
        imagePreviewElement.src = imageSrc;
        imagePreviewElement.style.display = "block";
        imagePreviewElement.style.width = "300px";
        imagePreviewElement.style.height = "100px";
        imagePreviewElement.style.border = "1px solid #ccc";
    }
};

 
 </script>