How to track orientation in jquery media?

Question

css

guys have a media query in jq.
if(window.matchMedia('(max-width: 991px)').matches) {
$('.caption').click(function(){
$(this).siblings('.info-descr').slideToggle ();
$(this).find('.right-arrow').toggleClass('rotate');
});
}

but when switching to landscape orientation, the code also works, and there is already 1024px width, you have to update the page so that the code no longer works.
How to make it track changes when switching to portrait, the code worked, but did not work when switching to landscape? i googled a lot. tried options with
window.addEventListener("orientationchange", function() {
if (window.matchMedia("(orientation: portrait)").
}
if (window.matchMedia("(orientation: landscape)").matches) {
alert("LANSCAPE")
}
}, false);

But everything worked clumsily. Apparently I'm not catching up with something and I don't understand where the function should be and where not. Please help.

Answer 1

Portrait from landscape differs only in aspect ratio, so it's best to detect the change on the resize event
Here, for example
https://jsfiddle.net/6t6fbkcy/7/

Answer 2

well, for example

$('.caption').click(function(){
if(window.matchMedia('(max-width: 991px)').matches) {
$(this).siblings('.info-descr').slideToggle();
$(this).find('.right-arrow').toggleClass('rotate');
}
});