Try It Editor
Tip: Press
Ctrl/⌘ + Enter
to Run
▶ Run
Reset
Copy
Download
Code
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Basic jQuery Plugin</title> <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script> <style>#box{padding:10px;border:1px solid #ccc;width:260px}</style> </head> <body> <div id="box">Hello</div> <button id="run">Run plugin</button> <script> (function($){ $.fn.hello = function(){ return this.each(function(){ $(this).css({background:'#e3f2fd'}).append(' — from plugin'); }); }; })(jQuery); $("#run").on("click", function(){ $("#box").hello(); }); </script> </body> </html>
Output