title: How to replace magnificPopup (ajax) content with new ajax content
body: <p>Im working on a website which has a popup for a product information. Inside the popup is a link which opens a second popup for the shipping information. </p>
  
  <p>What we want is to replace the popup content when the second link is clicked. </p>
  
  <p>Is this possible? </p>
  
  <p>This is what I have been trying so far (no luck)..</p>
  
  <pre><code>// first popup
  $('.pop-ajax').magnificPopup({
          type: 'ajax',
          closeBtnInside: true, // put close button on inside
  
          callbacks: {
              parseAjax: function(mfpResponse) {
                  mfpResponse.data = $(mfpResponse.data).find('.l-main');
              },
              ajaxContentAdded: function() {
                  // console.log('it works');
              }
          }
  });
  
  // Second popup (loads first popup when a link inside is clicked)
  $('.pop-product').magnificPopup({
      type: 'ajax',
      closeBtnInside: true, // put close button on inside
  
      callbacks: {
          parseAjax: function(mfpResponse) {
              mfpResponse.data = $(mfpResponse.data).find('#product-ajax');
          },
          ajaxContentAdded: function() {
              console.log('First popup');
              // var mfp = $.magnificPopup.instance;
              //     mfpContentContainer = mfp.contentContainer;
              //     mfpContent = mfp.content;
  
  
              $('.pop-ajax').click(function(){
                  $('.pop-product').magnificPopup('close');
                  $('.pop-ajax').magnificPopup({
                      type: 'ajax',
                      closeBtnInside: true, // put close button on inside
  
                      callbacks: {
                          parseAjax: function(mfpResponse) {
                              mfpResponse.data = $(mfpResponse.data).find('.l-main');
                          },
                          ajaxContentAdded: function() {
                              // console.log('it works');
                          }
                      }
                  });
              });
          }
      }
  });
  </code></pre>
  
  <p>The second popup is a large content area on the site. One of the links inside this area has a link with the <code>.pop-ajax</code> class. However we can't seem to update or replace the popup content with the new content. </p>
  
  <p>Can anyone help shed light on what I am doing wrong here?</p>