Error calling functions from $ (document) .ready

The site uses Magnific Popup and slick plugins. When calling functions using them as follows:

$(document).ready(function() { initPopupsFromComBlock(); runBrandsSlick(); //some other code..... }); 

I get an error in the console - TypeError: $ (...). MagnificPopup is not a function. However, if you call these functions beyond $ (document) .ready,

 initPopupsFromComBlock(); runBrandsSlick(); 

then everything works fine. initPopupsFromComBlock () is outside of $ (document) .ready.

 function initPopupsFromComBlock() { $('.fast-order').magnificPopup({ ....... }); } 

Script connection sequence:

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js" integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q" crossorigin="anonymous"></script> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js" integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl" crossorigin="anonymous"></script> <script src="{{ asset('js/magnific-popup/jquery.magnific-popup.js') }}"></script> <script type="text/javascript" src="{{ asset('slick/slick.min.js') }}"></script> <script type="text/javascript" src="/js/myscript.js" ></script> 

PS: It gives the same error if the code from the function being called is fully placed inside $ (document) .ready. What's the catch?

PPS: Further, a similar problem arises when calling a function that uses Magnific Popup from another function.

 function getCurrency() { $.ajax({ url: "/modules/content/ajax/get_currency.php", type: 'GET', dataType: 'HTML'}) .done(function (data) { if (data) { $('.top-popups .currency-wrap .d-table a').remove(); $('.top-popups .currency-wrap .d-table').append(data); } else { magnificPopupOpenError('Во время загрузки валюты произошла ошибка!'); } }).fail(function () { magnificPopupOpenError('Сервер не отвечает!'); }); 

}

Function magnificPopupOpenError:

 function magnificPopupOpenError(text) { $.magnificPopup.open({ items: { src: '<div id="white-popup"><div class="custom-border-tooltip">' + text + '</div></div>', type: 'inline' } }); 

}

Error: TypeError: $ .magnificPopup is undefined