Using a style on clustered vectors and unclustered vectors

At the moment Im making a viewer with openlayers, js, css and html. In my map I have a GeoJSON served by geoserver with a few points that are close to each other. For these points I have made my own SVG's and turned them to icon/png's to be served on the map. Due to the symbology being connected to a variable: "category" varying from 1 to 3. For this I made a function which I call upon in the "style" parameter at my GEOJSON. Due to the points being to close to each other I decided to make clusters of them depended on zoomlevel. This all functioned properly however I could not get the same style function to respond on my new clustered layer. After trying several things (mostly changing the function for the style (see below)) I finally made it that the clusters now appear as icon/png's, but the problem is that it does not respond of the "else if" statements in my function anymore and therefor the varying icon's on the "Category" variable are not visible anymore.

Below my code:

/* style icons */
var ottergroen = new ol.style.Icon({
    src: 'img/bottlenecks_icons/otter_groen.png',
    anchorOrigin: 'bottom-Left',
    anchorXUnits: 'fraction',
    anchor: [0.1, 0],
    imgsize: [2, 2]
});


var ottergeel = new ol.style.Icon({
    src: 'img/bottlenecks_icons/otter_geel.png',
    anchorOrigin: 'bottom-Left',
    anchorXUnits: 'fraction',
    anchor: [0.1, 0],
    imgsize: [2, 2]
});


var otteroranje = new ol.style.Icon({
    src: 'img/bottlenecks_icons/otter_oranje.png',
    anchorOrigin: 'bottom-Left',
    anchorXUnits: 'fraction',
    anchor: [0.1, 0],
    
});


var otterrood = new ol.style.Icon({
    src: 'img/bottlenecks_icons/otter_rood.png',
    anchorOrigin: 'bottom-Left',
    anchorXUnits: 'fraction',
    anchor: [0.1, 0],
    
});

/*function to call upon the variables and return the right icon */
function getpriority(Category) {
    if (Array)
    return ottergroen;
    else  if(Category == "1") {
        return otterrood;
    } else if (Category == "2"){
        return ottergeel;
    } else if (Category == "3") {
        return ottergroen;
    }
};




/* making the clustered layer  */
var bottlenecksjsonsource = new ol.source.Vector({
  url: 'http://localhost:8080/geoserver/Gbra/ows?service=WFS&version=1.0.0&request=GetFeature&typeName=Gbra%3ABottlenecks_gbra_filtered&outputFormat=application%2Fjson',
  format: new ol.format.GeoJSON()

});

var bottlenecksjsonlayer = new ol.layer.Vector({
  source: bottlenecksjsonsource
});
// a clustered source is configured with another vector source that it
      // operates on
      var jsoncluster = new ol.source.Cluster({
        source: bottlenecksjsonsource
      });

      // it needs a layer too
      var clusteredbottlenecks = new ol.layer.Vector({
        source: jsoncluster,
        title: 'bottlenecksclustered',
        style: function(feature){
          return new ol.style.Style({
            image: getpriority(feature.get('Category'))
          })
        }
        
      });
      clusteredbottlenecks.setVisible(false);
      map.addLayer(clusteredbottlenecks);
      console.log(clusteredbottlenecks);

It would be awesome if someone could tell me what I'M doing wrong here. At the moment it only visualizes this symbol ("ottergroen") as seen in the pictures below on every zoom level:

and below the image of what the non clustered vectors should look like:

Thanks in advance <3!