Interactive rating component challenge - Solution using Bootstrap

Hey guys!

After a few weeks working on other projects, I'm back on Frontend Mentor for my first challenge including some JavaScript!!! I've been learning how to use Bootstrap 5, Sass and jQuery lately so I told myself that building a Frontend Mentor project would be a great way to put into practice my new skills!

I definitely LOVE working with those tools, even if I'm far from being comfortable with them for now! It's actually the first project I've coded with them without following a tutorial. I had so much fun and I'm so proud of the result because... it actually works and that amazes me!

I have a question for people who like jQuery as much as I do but who have more experience then me: what do you think about my few lines of code?! Is it decent? Is there another (better or more efficient) way to achieve the same result? Here is the snippet if you don't feel like going into my repository!

$(document).ready(function() {

    let num = "";

    $(".box__rate-btn").click(function() {
        $(".box__rate-btn").removeClass("active");
        $(this).addClass("active");
        num = $(this).text();
    });

    $(".box__btn").click(function() {
        $(".box__rating-message").text("You selected " + num + " out of 5");
        $(".attribution").show(500);
        $(".state1").hide();
        $(".state2").show();
    });

});

Happy coding and... happy Halloween if you don't see me here before the end of the month! Cheers :)