<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <script src="jquery-3.2.1.js"></script> <style> #div1{ height: 400px; width: 600px background-color: #7b7b7b; opacity: 1; } </style> </head> <body> <div id="div1"></div> <script> (function ($) { $.fn.extend({ hello:function () { setTimeout("$("#div1").css("background-color","red");",2000); setTimeout("$("#div1").css("background-color","black");",4000); setTimeout("$("#div1").css("background-color","gold");",6000); } }) })(jQuery); $("#div1").hello() </script> </body> </html>