I assume that, when the hover is removed (the mouse pointer leaves a star), you want to revert the text to that associated with last selected star.
S ample survey attached:
<script type="text/javascript" charset="utf-8">
$(document).ready(function() {
// Identify this question
var q1ID = {QID};
var thisQuestion = $('#question'+q1ID);
var insertedTexts = {
'1': 'mangelhaft',
'2': 'ausreichend',
'3': 'befriedigend',
'4': 'gut',
'5': 'sehr gut'
};
$('#starvalue').attr('data-text', '');
// Listener on the radio inputs
$('input.radio', thisQuestion).on('click', function(e) {
// The clicked value
var value = $(this).val();
// Pipe the text to the div
$('#starvalue').text(insertedTexts[value]).attr('data-text', insertedTexts[value]);
});
// Hover events on the stars
$('.star-rating', thisQuestion).hover(
function() {
// The value
var value = $(this).attr('data-star');
// Pipe the dynamic text to the div
$('#starvalue').text(insertedTexts[value]);
}, function() {
$('#starvalue').text($('#starvalue').attr('data-text'));
}
);
});
</script>
S ample survey attached: