how to disable an input with a checkbox JQuery

I have a webpage that is supposed to ease the writing of code for another program (Ren'Py), and I made it in a way that there is a button that adds 3 inputs (checkbox, text, text). Now I wanted to make it so that the first input is disabled and will only enable when the checkbox is checked.

I have looked at many other questions just like this, but none seemed to help, I made a fiddle of the code working in a static run, so where the code is already there. But It should work for all of them, even if there is a new one added.

var i = 0 //the variable is for a later cause, doesn't affect this, isn't implemented yet
function addDialogue() {
        ++i
        var poseLine = '<input type="checkbox" id="poseBox' + i + '" class="pose" />\n<input id="pose' + i + '"  />'
        var text = '<input id="text' + i + '" >'
        var breaker = '<br />'
        var line = poseLine + text + breaker
        $( "#dialogeAndCode" ).append( line )
}

function main () {
        console.log( "JQuery has loaded" )
        $( ":checkbox" ).change( function() {
                if ( $( this ).hasClass( "pose" ) ) {
                        $( this ).next().prop( "disabled", !$( this ).is( ':checked' ) );
                }
        } );
}

$( document ).ready( main );

<script src="https://code.jquery.com/jquery-3.1.0.min.js"></script>
<input type="button" id="buttonAddText" value="Add a dialoge line" onclick="addDialogue();">
<br />
<div id="dialogeAndCode">
</div>

and here's the static run (JS Fiddle): https://jsfiddle.net/DiamondFrost/1dsdd2Lx/