Jquery Making Rateit (star) Plugin Work For Added Elements

I have some rating code: $('div.rateit').rateit(); I want it also to function for added elements. Here is the plugin: http://rateit.codeplex.com/

Solution 1:

It works! :

If you have a look at the source of the rateit plugin (src/jquery.rateit.js) you'll see that at the end of file appears the invocation:

//invoke it on all .rateit elements. This could be removed if not wanted.
$(function () { $('div.rateit, span.rateit').rateit(); });

What you need to do is to invoke this function again once you load or add elements.

In my case I was using jQuery.ajax (...) and when loading new elements with the 'rateit' css class it wasn't working. Now they do with this line inside the ajax response:

<script type="text/javascript">          
jQuery(document).ready(function(){
    jQuery('div.rateit, span.rateit').rateit(); 
});
</script>

Solution 2:

Since you are adding the new elements server-side, just add the CSS class rateit to each element you are adding. Assuming you only want to make the div elements a rateit object, your existing jQuery code will work.

Solution 3:

Seems you might need to use jQuery on() method, like this:

  $('div.rateit').on('event which triggers the rateit()', rateit);