Ajax jQuery api /cart/add.js isnt working

[PIXIE1]

okay so check this out, this is a script for a button I wrote. It is supposed to add the product "priority processing" to the card if you press it, without reloading the page and notification. you can also go to https://pillow-squish.com/404 and check it out.

{% comment %} BUTTONTEST {% endcomment %}

  <button id="priority-processing-button">Add Priority Processing</button>

  <script>
    $(document).ready(function() {
      $("#priority-processing-button").click(function() {
        $.ajax({
          url: "/cart/add.js",
          type: "POST",
          dataType: "json",
          data: {
            quantity: 1,
            id: 8160342704429,
            properties: {
              "title": "Priority Processing"
            }
          },
          success: function() {
            alert("Priority Processing added to cart!");
          },
          error: function(XMLHttpRequest, textStatus, errorThrown) {
            console.error("Error: " + errorThrown);
          }

        });
      });
    });
  </script>

 I also inserted AJAX into the theme.liquid with this code:

{% comment %} add jQuery {% endcomment %}
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.3/jquery.min.js"></script> 

it gives me a 404 error in the console. im not to good at coding to be honest since im just starting out. I desperately hope somebody can help me i've been stuck on this for 2 days now...

The product id is definetly 100% right i believe. I went on the product page in the admin pannel and copied the ID from the URL.

[Ole_Visionz]

Little late to the party, but let's answer it for future googlers just like me.

Usually the 404 error means you have the wrong id in your request. I also thought that the product id is 100% correct. But the /cart/add.js doesn't need the product id but the variant id. That solved the problem for me, maybe it did for you, too. 🙂