Task 1.
Create two variables: y1 = 6 and y2 = 3. Create a div (assign any class you like) and display the sum of y1 and y2 inside it.
Task 2.
Create a div with the text "Hello" and the class .out-2. Using innerHTML, append the text "Master" inside it. The final result should be: Hello Master. (Use shorthand syntax)
Task 3.
Create an input and a button. When the button is clicked, display on the page the number entered by the user multiplied by 10.
Task 4.
Create an input, a button, and an empty div with the class .out-4. When the button is clicked, display a new <h1> element inside the div with the text entered by the user (e.g. <h1>Text Input</h1>). Use string concatenation ('<h1>' + ...).
Task 5.
Create two inputs with type="number". When the button is clicked, display the sum of the entered values on the page.
Task 6.
Create an input, a button, and an empty div with the class .out-6. The user enters text into the input. When the button is clicked, add a new <p> element with that text into the div (e.g. <p>Text Input</p>). Use string concatenation ('<p>' + ...) and shorthand syntax. Important: the text must be appended, not replaced. Each click adds a new line.
Task 7.
Create an input and a button. When clicked, display the number entered by the user plus 10 in a div.
Hint: pay attention to the data type.
Task 8.
Create an input, a button, and an empty <ul> with the class .out-8. The user enters text into the input. When the button is clicked, create a new <li> element with that text and add it to the list. Use string concatenation ('<li>' + ...) and shorthand syntax. Each click should add a new list item.
Task 9.
Create an input with type="number" and a button with the text "1". When the button is clicked, append the digit entered by the user to the button text. Each click should continue appending to the updated value.
Hint: pay attention to the data type.
Task 10.
Select the <body> element using querySelector ('body'). Then set its innerHTML to an empty string (...innerHTML = ''). Observe what happens.