title: magnific popup not working
body: <p>I am using Magnific Popup. </p>
  
  <pre><code>$(document).ready(function() {
    $('.image-viewer').magnificPopup({
        type: 'ajax'
    });
  });
  </code></pre>
  
  <p>This is the html:</p>
  
  <pre><code>&lt;a href="/site-media/{{ photo.image }}" class="image-viewer"&gt;&lt;img class="fest-content-event-content-photo" width = "100%" src="/site-media/{{ photo.thumbnail2 }}" /&gt;&lt;/a&gt;
  </code></pre>
  
  <p>But, it isn't working and the console shows error:</p>
  
  <pre><code> Uncaught TypeError: Property '$' of object [object Object] is not a function (index):30
  (anonymous function) (index):30
  fire jquery.js:3048
  self.fireWith jquery.js:3160
  jQuery.extend.ready jquery.js:433
  completed
  </code></pre>
  
  <p>What is wrong? I have not loaded tje jquery.js file twice.</p>