How to correctly select in Jquery

Question

I cannot understand why I can't select a group of buttons with Jquery.

This is my HTML (The tbody is built on an ajax call) on the page load.

    <table class="table table-hover" id="tblGroup">
      <thead>
        <tr>
          <th>Groups</th>
        </tr>
      </thead>
      <tbody>
       <tr>
       <td>xxx123</td>
       <td><button class="btn btn-info delete" type="button" value="xxx123">Delete</button><button class="btn btn-info view" type="button" value="xxx123">View</button></td></tr>
       // more and more rows omitted
      </tbody>
    </table>

I'm my javascript file I have (which is placed in document.ready):

$("#tblGroup tbody .view").on("click", function () {
    alert("view");
});

I do not see the alert when I click the view button.

However if I type from the console

$("#tblGroup tbody .view")

It will find all of the buttons.

I'm at a total loss why my button click event won't work.

Your code actually works for me, where are you defining that click event? Maybe it is getting overwritten or not running? Fiddle: https://jsfiddle.net/0b2zyguy/ — IrkenInvader, Jan 15 '16 at 17:37
@IrkenInvader have you dynamically generated your button elements to say what you're saying? — Roko C. Buljan, Jan 15 '16 at 17:39
Thank you to whoever left the original solution. Also thank you for the link, it explains my issue and why I am seeing the results I am getting. — John Doe, Jan 15 '16 at 17:40

How to correctly select in Jquery

0 Answers0