Bind JQuery events to dynamic elements
Event binding of dynamic elements March 22, 2017 Most of the time our code generates the HTML elements on run time (dynamically). Often we need some JQuery events to occur on these dynamically generated elements. Let's say you have written an editor which provides users with the facility to write free text, add text boxes to the editor area, add check boxes to editor area and other elements. Let's say you have added a text box into the editor area. Now you want to add color of text when your text box gains focus and remove color when it leaves focus. As this element (text box) has been generated dynamically so you can not apply focus event on it by using the following syntax. (See code in the following link) Wrong way to bind event . Above approach will look for element not present in DOM and it will try to bind events on those elements. We should look for a mechanism which will unable us to link the events on dynamically created content in DOM on run time.