Why is this jQuery click function not working?
You are supposed to add the javascript code in a $(document).ready(function() {}); block.
i.e.
$(document).ready(function() { $("#clicker").click(function () { alert("Hello!"); $(".hide_div").hide(); });});As jQuery documentation states: "A page can't be manipulated safely until the document is "ready." jQuery detects this state of readiness for you. Code included inside $( document ).ready() will only run once the page Document Object Model (DOM) is ready for JavaScript code to execute"
I found the best solution for this problem by using ON with $(document).
$(document).on('click', '#yourid', function() { alert("hello"); });for id start with see below:
$(document).on('click', 'div[id^="start"]', function() {alert ('hello'); });finally after 1 week I not need to add onclick triger.I hope this will help many people
Your code may work without document.ready() just be sure that your script is after the #clicker. Checkout this demo: http://jsbin.com/aPAsaZo/1/
The idea in the ready concept. If you sure that your script is the latest thing in your page or it is after the affected element, it will work.
<!DOCTYPE html><html><head><meta charset=utf-8 /><title>JS Bin</title></head><body> <script src="https://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script> <a href="#" id="clicker" value="Click Me!" >Click Me</a> <script type="text/javascript"> $("#clicker").click(function () { alert("Hello!"); $(".hide_div").hide(); });</script></body></html>Notice:In the jsbin demo replace http with https there in the code, or use this variant Demo