jQuery Plugin To Initialize Matched Elements Dynamically - initialize.js

File Size: 10 KB
Views Total: 1695
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
   
jQuery Plugin To Initialize Matched Elements Dynamically - initialize.js

initialize.js is a lightweight jQuery extension/alternative to the jQuery.each() API that allows to execute a function for each matched element, no matter how and when the element is added into your document.

How to use it:

1. Load both jQuery library and the jQuery initialize.js script in the document as usual.

<script src="//code.jquery.com/jquery.min.js"></script>
<script src="jquery.initialize.js"></script>

2. Call the function on the target element. In this case, we want every .initialize-me item to have color changed to blue, no matter how and when item with this class is added.

$(".initialize-me").initialize(function(){
  $(this).css("color", "blue");
});

3. You can even add item with .initialize-me class via browser inspector - proper js will be executed on it just when you finish edition.

$("<div>").addClass('initialize-me').text("New item that was just appended to body and it's color is automatically changed to blue without any additional js.").appendTo("body");

Changelog:

2023-06-24

  • v1.3.2: No parentElement of html

2023-04-26

  • v1.3.1

2017-03-14

  • Fixed this.selector deprecation

This awesome jQuery plugin is developed by pie6k. For more Advanced Usages, please check the demo page or visit the official website.