multi image select and print selected images using jquery

i have image set div tag like below:

    <div class="gallery" id="gallery">
    <img name=imgqr[] id="mainImg" src="data:image/png;base64, {!! base64_encode(QrCode::format('png')->size(180)->generate($user->emp_code[$i])) !!} " width="100"; height="80"; >&nbsp;&nbsp;</td></tr>                             
     </div>
<input  class="printMe" type="button" onclick="printImg()" value="printMe" />

my CSS :

img.selected {
    border: 3px solid green;
}
img:hover {
    cursor: pointer;
}

i need to select image when user click on it, i added the script for this and it working, but i click print button it doesnt print qrcode image ,in meantime is printing whole page.

 <script>
        function printImg() {
  pwin = window.open(document.getElementById("mainImg").src,"_blank");
  window.print();
}
$(function () {
    $("#gallery > img").click(function () {
        if ($(this).data('selected')) {
        $(this).removeClass('selected');
        $(this).data('selected', false);
    } else {
        $(this).addClass('selected');
        $(this).data('selected', true);
    }
    });
    var selectedImageArray = [];
$('#gallery > img').each(function () {
    if ($(this).data('selected')) {
        selectedImageArray.print(this);
    }
});
 window.onafterprint = function(){
      window.location.reload(true);
 }

});

I also need check if image is selected and pass through array value to print seleted images +data name.

via Chebli Mohamed