how to click a button using jQuery?

Question

Here is the DOM :

<div class="form-actions">
<button class="btn btn-primary" type="submit">Save device</button>
</div>

I want to use Jquery to select the button and click on it? I tried using : jQuery(".btn btn-primary").click() which is not working

Answer 1

You are trying to select an element with both classes, therefore your selector should be .btn.btn-primary.

$('.btn.btn-primary').click();

You were trying to select a element with class .btn-primary that was a descendant of a .btn element.

Answer 2

Your selector is incorrect; because both classes are on the same element you need to separate them by . with no spaces:

jQuery(".btn.btn-primary").click()

Answer 3

You could use the jQuery trigger() method to trigger the behaviour of an existing event handler.

https://api.jquery.com/trigger/

example:

<button id='testButton'>Test</button>

<script>
$(function(){
   $('#testButton').on('click' , function(){
        alert("I've been clicked!");
   });

   //now on another event, in this case window resize, you could trigger
   //the behaviour of clicking the testButton?

  $( window ).resize(function() {
        $('#testButton').trigger( "click" );
  });

});

</script>

Answer 4

See the following:

https://api.jquery.com/trigger/

Use $(".btn-primary").trigger("click");

Hope that helps

Answer 5

Just incase you did not learn yet, you can always define an Id for the button and use it this way:

<div class="form-actions">
  <button id="mybutton" class="btn btn-primary" type="submit">Save device</button>
</div>


 $('#mybutton').click(function(){
    //your code goes here
 });

Answer 6

$( window ).load(function() { $(".btn-primary").trigger('click'); });