<h1>Contoso Web Developer Conference</h1> <h2>Finding elements using jQuery</h2> <div>This session is about identifying elements using jQuery methods and selectors.</div> <h3>Rate this session</h3> <div id="rating-container"> <div class="rating-circle"></div> <div class="rating-circle"></div> <div class="rating-circle"></div> <div class="rating-circle"></div> <div class="rating-circle"></div> </div> <script src="//ajax.aspnetcdn.com/ajax/jQuery/jquery-2.1.4.min.js"></script> <script> // your answer would go here $(function () { $('#rating-container div').hover(function (mousein) { var circle = $(this); circle.addClass('rating-hover'); circle.prevAll().addClass('rating-hover'); circle.prevAll().andSelf().removeClass('rating-chosen'); }, // on mouse out function (mouseout) { $(this).removeClass('rating-hover'); $(this).prevAll().removeClass('rating-hover'); // circle.prevAll().andSelf().removeClass('rating-chosen'); }); $('#rating-container div').click(function () { var circle = $(this); circle.addClass('rating-chosen'); circle.prevAll().addClass('rating-chosen'); //getting index of the current circle turned green var index = $('#rating-container').children().index(circle); }); });
var
This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)