Dynamically Added Button, Jquery Not Working

I've been going through my dynamically added code and changing everything that was using .click() to use .on('click') and its been working great but now I've run into something tha

Solution 1:

in your .after(), there is typo mistake in <input type=text there should be quote like <input type="text"

You have not define whatmeatfield variable. it should be

var whatmeatfield

Also you are directly passing html of some element id, you need to parse it to integer. like

var whatmeatfield = parseInt($("#meat_field_count").html()) ;

This may help you to solve your issues

Solution 2:

The problem may occur becouse of two things.

1. You're using id selector and you're porobably adding another button with the same id and as far as html spec says id should be unique.

What can you do? Change ID to CLASS.

2. The problem occurs becouse you're changing the id to schema like #remove_btn_1, #remove_btn_2, #remove_btn_3 and therefore you do not have any handler for this buttons.

What can you do? Change selector from "#remove_btn_1" to "[id*=remove_btn_]"

Of course same with #add_btn_

Post me back if it was helpful.