Create function in jquery

Question

I am trying to make a jquery function, and used below code, but not getting any output. Please tell me the process to make it.

<script type="text/javascript">
 (function($){
 $.fn.myplugin = function(){
 alert(this.id);
 };
 })(jQuery);
 $("#sample").myplugin();
</script>

• Misha Reyzlin: do you have the element with an id "sample" somewhere in your document? is this script tag placed below the HTML? if not, wrap the code with $(document).ready(function() { // here goes your code });

Answer 1

You can see the working code here – http://jsfiddle.net/gryzzly/YxnEQ/

Note that you need an element with id "sample" to be present in your document when you are running the above code. Also, the this is pointing at jQuery object, so in order to get the elements id, you need to use either of the following:

alert( this[0].id );

or

alert( this.attr('id') );

The first is preferable, because it's faster.

• Misha Reyzlin: what browser you are in? is jQuery loaded on the page?

Answer 2

Try this:

<script type="text/javascript">
 $(document).ready(function(){
 myplugin($("#sample"));
 });
 function myplugin(obj){
 alert(obj.id);
 }
</script>

• ip_x: Actually i was not able to workout solution given by @Kanishka , so this answer is an improvement to his solution .Just thought of sharing it

Answer 3

Try this:

<script type="text/javascript">
$(document).ready(function(){
 $("#sample").myplugin(this.id);
});
function myplugin(id) {
 alert(id);
}
</script>

Answer 4

Try changing

 alert(this.id);

to

 alert(this[0].id);

As you're getting a jQuery object array.

Answer 5

alert(this.attr('id'));

this in that context is a jQuery object, not a raw DOM element.

• Dheeraj Agrawal: so what should be the code & how I will implement any jquery function?