Javascript Unexpected Token ":" When that isn't in my code?

I'm pulling data from an API to which then I'm running a function for each item in an array in the API. I get this error

Uncaught SyntaxError: Unexpected token ':'

This is my code:

<!-- Card !-->
<div class="card">
 <div class="left">
   <img src="#" class="image">
 <div class="right">
   <h3 class="title">Lighting Control</h3>
   <button class="view">View Lighting Control</button>

.card {
  display: flex;
  width: 80%;
  justify-content: space-around;
  align-items: center;

<script src=""></script>

var url = "*****(Hidden for obvoius reasons)&subdomain=eastmidlandseventservices&product_group_id=1";
  url: url,
  method: 'GET',
  dataType: 'JSON',
  success: function(data) {
    data.forEach(function(catagory) {
      buildSubCatCard(catagory, data);
  error: function(err) {
    console.log('error:' + err);

    const buildSubCatCard = (catagory, data) => {
  // Create elements for card
  const div_card = document.createElement('div');
  const div_left = document.createElement('div');
  const div_right = document.createElement('div');
  const header = document.createElement('h3');
  const button = document.createElement('button');
  const img = document.createElement('img');
  // Append created elements in DOM
  const body = document.querySelector('body');
  // Set content and attributes
  header.innerHTML =;
  button.innerHTML = "View" +;
  img.setAttribute('src', data.products.icon.url);
  div_card.setAttribute('class', 'card');
  div_left.setAttribute('class', 'left');
  div_right.setAttribute('class', 'right');


Unsure why I'm getting this error, I've tried multiple javascript checkers and they all come back clear... The code is meant to create multiple cards for each item in the array. Just a bit confused on this error from chrome.