Implementation design pattern for html javascript on script tag

I'm fairly new to javascript and web dev. I'm making a simple template formatting web app. It's pretty much going to have forms where a user can fill in personal info such as name, age, gender, etc and using javascript I'm going to output a personal paragraph with the users submitted info. I'm using template literals on this and I know how to do it, I'm just confused as how to design the javascript code within the script tag, as in the design patterns? Is the standard similar to OOP with classes such as initializing the object and parsing the forms? Any advice and suggestions are really appreciated!

Here is some sudo code

//not real code, but you get the gist
class Template:
   var name = html.InnerElement
   var age = html.InnerElement
   var food = html.InnerElement

   const paragraph = () => {
   //template literal
    paragraph = 
   `Dear ${this.name},
    Happy Birthday! You're turning ${this.age today}.
    This is a big accomplishment, we must celebrate. Are you free next week for some ${this.food}?`

   return paragraph

   }