Search code examples
javascriptjqueryhtmlclickjsfiddle

JQuery Click Function Not Working


I'm trying to get my code to click and show an alert, but the code doesn't seem to work. I've written the code here:

https://jsfiddle.net/MGames/9eu94Lau/1/

Here is my html:

<div class="add-cart-button-col col-right">
<a class="checkout-button nsg-button nsg-grad--heeb-orange" href="https://mycheckoutlinkgoeshere.com" data-query="https://linkcheckoutgoeshere.com">
                      CHECKOUT
                    </a>
                  </div>

And here is the code that does not to show the alert after clicking

$(".checkout-button nsg-button nsg-grad--heeb-orange").click(function() {
  alert('hohoho');
});

I would appreciate the help to find out what I'm doing wrong. Thank you.

Edit: This question is different due to the fact that I'm asking for clarification for an error that was present in my code. It's not a duplicate of selecting an element with multiple classes...


Solution

  • 1 forgot to add. before each class.

    2.Remove spaces in between all classes (as you are trying all classes of single element not parent-child)

    Working snippet:-

    $(".checkout-button.nsg-button.nsg-grad--heeb-orange").click(function() {
      alert('hohoho');
    });
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
    <div class="add-cart-button-col col-right">
      <a class="checkout-button nsg-button nsg-grad--heeb-orange" href="https://mycheckoutlinkgoeshere.com" data query="https://linkcheckoutgoeshere.com">CHECKOUT</a>
    </div>

    Reference:-How can I select an element with multiple classes in jQuery?