Here is the what the solution should look like whenever the user clicks the link
new york
image image image
however when i do this again i get this error
new york
image image image
image image image
why does this occur...
Here is my code
 function getImageCategories() {
      images = document.createElement('ul');
    $('#categories').on('click', 'li>a', function () {
    ex_id = $(this).closest('li').index();
      ex_id = ex_id.toString();
      getResults();
           });
  }
  function getResults(){
        myExhibitionsView = document.getElementById('exhibitioncontent');
        document.getElementById('exhibitioncontent').innerHTML = "";
      json.forEach(function (element) {
          console.log(ex_id);
          if (element['exhibition_id'] === ex_id) {
              for (var j = 0; j < element.exhibits.length; j++) {
                  list = document.createElement('p');
                  list.id = 'image' + j;
                  list.innerHTML = "<img src='./images/" + element.exhibits[j].exhibit_image + "' alt='Photo Cover' height='200' width='200'>";
                  console.log(list);
                  myExhibitionsView.appendChild(images);
                  images.appendChild(list);
              }
          }
      });
  }
function 1 gets correct id for use when filtering and then 2nd function displays the correct data so why have duplicates? Thanks
HTML...
<ul id="categories">
                <li class="filter">Categories:</li>
                <li id="ny"><a href="#newYork" onclick="getImageCategories()"> New York</a></li>
                <li id="sc"><a href="#spanishCities" onclick="getImageCategories()">Spanish Cities</a></li>
                <li id="gv"><a href="#aGlasgowViewpoint" onclick="getImageCategories()">A Glasgow Viewpoint</a></li>
                <li id="sch"><a href="#someChurches" onclick="getImageCategories()">Some Churches</a></li>
                <li id="bh"><a href="#barcelonaHighlights" onclick="getImageCategories()">Barcelona Highlights</a></li>
                <li id="mp"><a href="#martin's Pictures" onclick="getImageCategories()">Martin’s Pictures</a></li>
            </ul>
        </div><!-- end .grid_12 - CATEGORIES -->
When the link is clicked... function is called