+ 2

How do i style output in javascript.

Guys help me please🙏! Can you please show me how do i make the output attractive, how do i add css with that, what I do so that the output change it's style (for example fonts becomes red, or green according to output) Please help me... I am trying a lot but nothing is happening... I would be so thankful if you help me 🙏đŸ„ș 👇help me with this code 👇 https://code.sololearn.com/W0K980Y7A1Kq/?ref=app

20th Jul 2020, 6:23 PM
VOID
VOID - avatar
3 Answers
+ 3
For output shall be used HTML tags instead document.write and then can be used CSS for style.
20th Jul 2020, 7:24 PM
JaScript
JaScript - avatar
+ 3
That can be look like: <body> <button id=btn onclick=luckynum()>Let's Start</button> <div id="myOut"></div> <script> function luckynum(){ let myOut = document.getElementById("myOut"); let mynum=window.prompt("Enter lucky Number:"); let num=Math.ceil(Math.random()); if (mynum==num){ myOut.innerHTML = "Congraluation your nmber is:" +mynum+ " same as" +num+",lucky Number"; } else{ myOut.innerHTML = "<p style='color:red;'><b>Sorry</b> buddy your nmber is:" +mynum+ " not same as Lucky number " +num +"</p>"; } } </script> <body>
20th Jul 2020, 8:30 PM
JaScript
JaScript - avatar
+ 1
You can try this as Ja Play say's const ouput = document.createElement("p"); ouput.className = "ouput"; ouput.innerHTML = "write ouput here"; document.body.appendChild(ouput); Or you can do it this way but with inline styles document.write(`<h1 style="color:red">Sorry buddy your nmber is: ${mynum} not same as Lucky number ${num}</h1>`);
20th Jul 2020, 7:41 PM
Emanuel Maliaño
Emanuel Maliaño - avatar