I'm working with magnific popup in a laravel environment and want both to be working together, so I wrote this:

[**Here's a fiddle with the problem**](http://jsfiddle.net/1kpdcvcy/)

```
$(document).ready(function() {

    $('.image-popup-vertical-fit').on('click',function(){
    var image = $(this).attr('src');

    popnow(image);
});

    function popnow(a) {

    $('.image-popup-vertical-fit').magnificPopup({

        type: 'image',
        closeOnContentClick: true,
        mainClass: 'mfp-img-mobile',
        image: {
            verticalFit: true
        },
        items: {
        src: a
            }

    });
}
    });

```

**HTML:**

```
<div class="col-lg-6 col-sm-6 margin-top-60">
    {{HTML::image('images/recentprojects1.png','recent',array('class' => 'img-responsive img-center image-popup-vertical-fit')) }}
</div>

<div class="col-lg-6 col-sm-6 margin-top-60" id="test">
    {{ HTML::image('images/pricing1.png','recent',array('class' => 'img-responsive img-center image-popup-vertical-fit')) }}
</div>

```

If I click on the popup-opening image for the first time after page reload nothing happens, if I click for the second time it opens. 

But when I click on the first div for the first time after page reload and after that I click on the second, it still shows me the content of the first clicked div(on the first click on the second div - wrong image).

So it seems it doesn't take `var image` on every click. Is there something wrong with my function?

When I add `console.log(a)` to the top of `function popnow(a)`, the correct image src is logged.