Question

I’m creating a simple 5 star voting system and I’m trying to get the numeric value of my href element. The HTML works great but I’m not sure how to get the numeric value for the click event.

The HTML looks like this:

<div id="voting"> 
    <span class="rating_container"> 
        <span class="star_container">  
            <a href="#" class="star star_1" >1<span class="rating">Terrible</span></a>   
            <a href="#" class="star star_2" >2<span class="rating">Bad</span></a>
            <a href="#" class="star star_3" >3<span class="rating">OK</span></a>
            <a href="#" class="star star_4" >4<span class="rating">Good</span></a>   
            <a href="#" class="star star_5" >5<span class="rating">Great</span></a>   
        </span> 
    </span> 
</div> 

My jQuery click event looks like this:

$('.star').click(function(e) {
    e.preventDefault();

   // How can I get the numeric value of the clicked star (e.g., 5,6,7 etc)

});

Answer 1

Do this:

var n = this.firstChild.data;

Or this:

var n = this.className.split("_")[1];

---

If you need to convert from a string to a number, add this:

n = parseInt(n, 10);