ajax doesn't work in chrome

Question

I want to show html files on the same page after the button is clicked. I created 3 buttons and when I click on it the browser loads according page with images. But Chrome shows me an error:

jquery.min.js:2 Failed to load file:///C:/Users/Ksena/proj/ajax/tabs/autumn.html: Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https.
send @ jquery.min.js:2
ajax @ jquery.min.js:2
w.fn.load @ jquery.min.js:2
(anonymous) @ index.html:23
dispatch @ jquery.min.js:2
y.handle @ jquery.min.js:2


<div class="container">
        <button class="summer">Summer</button>
        <button class="autumn">Autumn</button>
        <button class="winter">Winter</button>
        <div class="output"></div>
    </div>
    <script>
        $(document).ready(function() {
            $('.summer').click(function(){
                $('.output').load('./summer.html');
            });
            $('.autumn').click(function(){
                $('.output').load('./autumn.html');
            });
            $('.winter').click(function(){
                $('.output').load('./winter.html');
            });
        });
</script>