Materializecss's checkbox input not working with jQuery

I am building the Simon game, and I'm using two sets of checkbox inputs from the Materialize.css library.

As shown in the official docs, here's the snippet for the checkbox -

<p>
  <input type="checkbox" id="test5" />
  <label for="test5">Red</label>
</p> 

The problem is, it doesn't seem to work at all when I try to detect if the checkbox is checked, using jQuery. I have tried both is(":checked") and prop("checked"), but neither works.

/**
 * Created by manishgiri on 12/26/16.
 */
$(document).ready(function () {
    if($("#start").is(":checked")) {
        console.log("inside");
        console.log("Start is checked");
    }
    if($("#start").prop("checked")) {
        console.log("inside");
        console.log("Start is checked");
    }
    //console.log("outside");
});

<link href="http://ift.tt/2hRiGD3" rel="stylesheet"/>
<script src="http://ift.tt/1oMJErh"></script>

<p>
      <input type="checkbox" id="start" />
      <label for="start">Start</label>
    </p>

Here's the complete app on Codepen. I would appreciate any help!