jQuery star-rating.js Demos

Setting a custom click function

$( '#star-rating-1' ).starrating({
	clickFn: function( selected ) {
		console.log( 'I clicked star #' + selected );

Changing the global plugin defaults

StarRating.defaults.initialText = "Rate me";

$( '#star-rating-2' ).starrating();

Using a select with a pre-selected value

$( '#star-rating-3' ).starrating();

Using the "data-option" attribute to set the options

// initialText is set on the select element using the "data-options" attribute.
// e.g. data-options='{"initialText":"Rate this"}'

$( '#star-rating-4' ).starrating();

Alternate way to create a new plugin instance

var starrating = new StarRating( document.getElementById( 'star-rating-5' ), {
	clearable: false,


star-rating.js uses gulp to build from src.

$ npm install
$ gulp

The compiled files will be saved in the dist/ folder.