Jquery .click won't console log or alert

javascript, jquery

Solution

As the button is added to the page after DOMReady you need to use a delegated event:

$(document).on('click', '.order_submit', function() {
    alert('Alert');
    console.log('TEST')
});

Note that for best performance you should change `document` in my example to the nearest element in the DOM which is present when the page loads. I would imagine this will be the table that `subtotal` gets appended to.

Problem

I have the following jquery: ``` $(".order_submit").click(function() { alert( "Alert" ); console.log("TEST") }); ``` When I put that function in to console I get the following: ``` $(".order_submit").click(function() { alert( "Alert" ); console.log("TEST") }); [ <input id=​"order_button" type=​"button" class=​"order_submit" value=​"Submit Order">​ ] ``` The button is created via this javascript: ``` var total = 0; for (var x in prodData) total += prodData[x].price * prodData[x].quantity total = Math.round(total * 100) / 100 var subtotal = '<tr><td><input id="order_button" type="button" class="order_submit" value="Submit Order"></td><td>Subtotal</td><td>$' + total + '</td></tr>'; ``` Does that have anything to do with it?

Original source