Why jQuery Select box change event is not working?

Question

I am working on product filters where user select from the select box according to his/her preference but I am not getting selected value by user in jQuery.

html code:

<select name="product_filter" id="product_filter">
        <option value="price_low_first">Price : Low to High</option>
        <option value="price_high_first">Price : High to Low</option>
        <option value="latest">Latest</option>
        <option value="popular">Most Popular</option>
</select>

jQuery code:

$(function () {
        $("#product_filter").change(function () {
          alert("hi")
            var selectedText = $(this).find("option:selected").text();
            var selectedValue = $(this).val();
            alert("Selected Text: " + selectedText + " Value: " + selectedValue);
        });
    });

Answer 1

Hi I believe that your code is perfect. Once please check jquery.min.js is included in your file. Please check if there are any console errors.Thank you.