title: Function Running Multiple Times in jQuery
body: <p>I have created a function which makes an ajax request to a PHP file and then adds a product to the basket. This function works as it should on the first click, but on each subsequent click it runs the function again. So for example, on the 2nd click it runs the function twice, on the 3rd click it runs it three times and so on... The problem is reset when the page is refreshed...</p>
  
  <p>Here's the on click code:</p>
  
  <pre><code>    $("#add_123456").click(function () {  
        $("#add_123456").addClass('added');          
        var quantity = $("#qty_123456").val();
        $('#basket_1').submit(function (event) {
          event.preventDefault();
          basket_add("feqf73nbdw7","123456","XYZ123","1","0.1","19.23");            
        });      
      });
  </code></pre>
  
  <p>Here's the function:</p>
  
  <pre><code>    function basket_add(cartID, productID, code, quantity, weight, price) {  
        var item_add = {"Cart_ID": cartID, 
                        "Product_ID" : productID,
                        "Code" : code,
                        "Qty" : quantity,
                        "Weight" : weight,
                        "Price" : price
                        };            
        $("#basketpop").animate({top: "40px"}, 200);    
        $.ajax({
          url:  '/templates/new/includes/ajax/add_to_basket.php',
          type: 'POST',
          data: item_add,
          dataType: "html",
          success: function(html){
            $('.basket_content').empty().append(html);
            $('.basket_content').css("height", "auto");
            var item_add = null;
          }
        });
        return false;          
      };
  </code></pre>
  
  <p>Don't think the issue is with the PHP file that is being called.</p>
  
  <p>Cheers</p>