Select A Button By Class jQuery-CodePudding

I am trying to have a button that, when clicked, will have some jQuery code linked to it. See the general layout below. However, there will be a variable number of rows on the table. All the buttons should have the same action but applied to its parent element. How can I achieve this?
Thanks

td {
  border: 1px solid black;
  padding: 10px;
}

<table>
  <tr>
    <td>Info</td>
    <td><button >Remove row</button></td>
  </tr>
  <tr>
    <td>Info</td>
    <td><button >Remove row</button></td>
  </tr>
  <tr>
    <td>Info</td>
    <td><button >Remove row</button></td>
  </tr>
</table>

CodePudding user response：

You can do that in several ways, question is tagged with jQuery so the easiest way using jQuery is :

$("button").on("click", function(ev) {
    $(this).parents("tr").remove()
});

This will remove tr element when clicked on it's button, you can do what you want inside that anonymous function

CodePudding user response：

Try this

let btns = $("button.remove"); // you will select only buttons with remove class

in your case you want something like this :

btns.each(function(){
let btn  = $(this);
   btn.on('click',()=>{
    // your stuff
   })
})

i hope it was useful !