I am trying to hide the next element with a class but I think it's getting confused by the html structure.

html:

```
<tr>
 <td>
  <input type="number" value="1" name="product_quantity" class="form-quantity" />
 </td>
 <td><a class="add_to_cart_button" href="#">Add To Cart</a></td>
</tr>

```

js:

```
$("tr").each(function() {
 $(this).find(".form-quantity").change(function() {
  $(this).closest(".add_to_cart_button").hide();
 });
});

```

JS Fiddle to see what I mean - <https://jsfiddle.net/vpvw6t53/>

I have tried using .parent, .children and .sibling so asking here :)