what is the wrong with this code it's not showing the div

This is my div and the check box :-

<input class="coupon_question" id="theControl" name="cadre_number" type="checkbox" onchange="valueChanged()" value="0" > إنهاء التوظيف </label> 
                                    </div>

                                    <div class="form-group col-sm-12" id="endDiv" style="display:none" align="right">
                                            <span><label class="radio" id="end1">تاريخ الإنهاء </label></span>
                                            <input class = "radio" value="2016-10-10" checked="" type="date">

                                            <span><label class="radio" id = "end3">سبب الإنهاء</label></span>
                                            <input class = "radio" type="text">
                                    </div>

and the Script is :

    function valueChanged(){
        if($('.coupon_question').is(":checked")){
            document.getElementById("endDiv").style.display = 'block';
        }

        else{
            document.getElementById("endDiv").style.display = 'none';
        }
    }