Updating Bootstrap container with Javascript

I have a Bootstrap container:

 <div class="container">
      <div class="jumbotron">
        <div class="row">
          <div class="col-lg-8">
            <form action="upload.php" method="POST" enctype="multipart/form-data">
                <h3><strong>Step 1: Choose an image from your PC</strong></h3><hr>
                  <input type="file" name="file" id="inputFile"><br><br> 
                  <button type="submit" name="btn_submit" value="upload" class="btn btn-secondary">Select image</button>
            </form>
          </div>
       </div>
     </div>
 </div>

Once the upload.php processes the upload successfull I would like to update the existing row container and add a new column container displaying the image on the right hand side. The following HTML works I can change the php inside the HTML if theres an easier method:

<div class="col-lg-4">
    <?php echo display_image($_SESSION['upload-file-destination']); ?><br>
    <p><strong>File size: <?php echo $_SESSION['file-size'] / 1024;?> KB</strong></p>
</div>

How can I achieve this using Javascript purely?