Why won't my onclick event display my JSON file?
<p>I'm new to JS and JSON, and am taking a class right now in it. For our project, we have to write a JSON file and display it using a button and JS. I have been staring at this for hours and thought I would give up and search for help. </p>

<p>Here is my JSON file:</p>

<pre><code>{
  "id": "Pavlov's Dog",
  "dateOfExhibition": "2018-07-08T22:00:00.000Z",
  "address": [],
  "street": "Bergmannstrasse 29",
  "city": "Berlin",
  "country": "Deutschland",
  "zip": "10473"
}
</code></pre>

<p>Here is my JS:</p>

<pre><code>(function () {


var url = 'http://localhost/Advanced_Web/Final_Project/data/exhibitions.json';
var request = new XMLHttpRequest();
button.onclick = function () {
request.open('GET', url);
    if (request.status == 200) {

        var json = JSON.parse(request.responseText);
        var data = '&lt;ul&gt;';

        data += '&lt;/ul&gt;';

        $('#exhibitions').html(data);

    } else {
        alert('An error has occurred.');
    }
};

})();
</code></pre>

<p>and a snippet from my HTML:</p>

<pre><code>    &lt;/nav&gt;

&lt;!-- JSON TO UNORDERED LIST --&gt;
&lt;button id="button"&gt;Click Me&lt;/button&gt;
&lt;div id="exhibitions"&gt;&lt;/div&gt;

    &lt;footer class="footer"&gt;
</code></pre>

<p>Thanks for any help!</p>