Can I build a dynamic reveal by JavaScript

I tried to build a reveal with no any tag on html and solely do it by JS but it seems not working.

$(document).ready(function () {


    $(document).on('open', '#Model1', function () {

        // create a div for the modal

        var modal1 = $('<div>');

        // add class and ID for modal1

        $(modal1).addClass('reveal revealStyle');

        $(modal1).attr('id', 'Modal2');

        $(modal1).attr('data-reveal', '');

        // append the modal1 div to mainbody


        // create a h1 for the div

        var modal1h1 = $('<h1>');

        // add text for the h1 tag


        // append the modal1h1 to the div


        // create the close button


		<main id="mainBody">
		<script src="assets/javascript/script.js"></script>