Onclick not working in my jquery

Question

I created dynamic div based on select if i click that dynamic div alert is not working

I don't know what is the problem

<label for="startDate">Date :</label>
<input name="startDate" id="startDate" class="date-picker" />
<div id="datecontent">
</div>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.2/jquery-ui.min.js"></script>
<script type="text/javascript">
var weekday = new Array(7);
        weekday[0] = "Sunday";
        weekday[1] = "Monday";
        weekday[2] = "Tuesday";
        weekday[3] = "Wednesday";
        weekday[4] = "Thursday";
        weekday[5] = "Friday";
        weekday[6] = "Saturday";
$(function() {
    $('.date-picker').datepicker( {
        changeMonth: true,
        changeYear: true,
        showButtonPanel: true,
        dateFormat: 'MM yy',
        minDate: 0,
        onClose: function(dateText, inst) { 
            $d = new Date(inst.selectedYear, parseInt(inst.selectedMonth)+1, 0).getDate();
            $(this).datepicker('setDate', new Date(inst.selectedYear, inst.selectedMonth, 1));
            html='';
            for(i=1;i<=$d;i++){
                date = inst.selectedYear+'-'+(parseInt(inst.selectedMonth)+1)+'-'+i;
                d = new Date(inst.selectedYear+'-'+(parseInt(inst.selectedMonth)+1)+'-'+i);
                console.log(date);
                n = weekday[d.getDay()];
                html += '<div class="datediv" id="'+date+'">div-'+i+'<br>'+n+'</div>';
            }
            $('#datecontent').html(html);
        }
    });
    $(document).ready(function() {
          $("datediv").click(function () {
            var id = this.id;
            alert(id);
            alert("Hello!");
          });
        });
});
</script>

if i click datediv alert not working> I dont know is problem

@Rory I'm not sure it's because the element is dynamically added. It's being added before attaching the click event (even though there is a `document.ready` inside another `document.ready`, but whatever). I guess the problem comes from `$("datediv")` instead of `$(".datediv")`. — Jeremy Thille, Aug 31 '17 at 11:02
Please specify the question which it is duplicate off.As@JeremyThille rightly pointed $(".datediv") is the correct representation. — Sunil Hari, Aug 31 '17 at 11:02
@JeremyThille the element is only added on the `onclose` event of the `datepicker`, not on load of the page. Although the typo in the selector is an issue too — Rory McCrossan, Aug 31 '17 at 11:03
@Shadow it's in the big yellow box at the top of the page...? — Rory McCrossan, Aug 31 '17 at 11:03
Yeah, I just noticed that, my bad. You're right. But the `$("datediv")` problem still stands. — Jeremy Thille, Aug 31 '17 at 11:04
$("datediv").click(function () { }) should be changed to $(this).on('click','.datediv',function(){}) @JeremyThille — Sunil Hari, Aug 31 '17 at 11:05
Try this: $('#datecontent').on('click','#datediv',FunctionName); — Steven, Aug 31 '17 at 11:19

Onclick not working in my jquery

0 Answers0