javascript - Upload img and click on it to appear in new tab

I have worked out a little web app, need to select images by user and show it in the browser, and I did that, now want the user if click on that img, will open new browser tab and show the img as full Hight and Width. "Now when user click on the uploaded image that has recently uploaded them will appear in new tab and full H and W." my html code:

<div id="wrapper">
  <div id="content">
  <div >

    <div >
      <div ></div>
      <div id="double">
        <h2>Please Upload Your Images</h2>
        <form id="uploadForm" action="upload.php" method="post">
          <h4>Select an Image</h4> <input name="files[]" type="file" multiple /><br /><br />
          <input type="submit" value="Submit"/>
        </form>
      </div>
      <div >
      </div>
    </div>

    </div>
</div>
Copy code

my script:

<script>
    $(document).ready(function(){
        $('#uploadForm').on('submit', function(e){
            e.preventDefault();
        $.ajax({
            url : "upload.php",
            type : "POST",
            data : new FormData(this),
            contentType : false,
            processData : false,
            success : function(data){
                $('#gallery').html(data);
                alert("Image Uploaded");
            }
        });

    });
});
Copy code

my php:

<?php 
//upload.php

$output = '';

if(is_array($_FILES)){
foreach ($_FILES['files']['name'] as $name => $value) {

    $file_name = explode(".", $_FILES['files']['name'][$name]);
    $allowed_ext = array("jpg", "jpeg", "png", "gif", "pdf");

    if (in_array($file_name[1], $allowed_ext)) {
        $new_name = md5(rand(). '.' . $file_name[1]);
        $sourcePath = $_FILES['files']['tmp_name'][$name];
        $targetPath = "upload/" . $new_name;

        if (move_uploaded_file($sourcePath, $targetPath)) {
            $output .= '<img src="'.$targetPath.'" width="150px" height="180px" />';
        }
    }
}
echo $output;
}

?>
Copy code