<html lang="en">
  <head>
    <meta charset="utf-8"/>
    <title>Object basics: Task 2</title>

    <link rel="stylesheet" href="../styles.css" />
  </head>

  <body>

    <section class="preview">



    </section>

  </body>


</html>
p {
  color: purple;
  margin: 0.5em 0;
}

* {
  box-sizing: border-box;
}
let bandInfo;

// Add your code here
const band = {
  name: 'Moonchild',
  nationality: 'LA, US',
  genre: 'alternative R&B',
  members: '3',
  formed: '2011',
  split: 'false',
  albums: {
    album1: {
      name: 'Starfruit',
      released: '2022',
    }, 
    album2: {
      name: 'Little Ghost',
      released: '2019',
    } }
}

bandInfo = `An ${band.genre} band "${band.name}" formed in ${band.nationality} in ${band.formed},
  and has been creating amazing songs. All ${band.members} members of this band play multiple instruments, and their music cretainly doesn't sound like played by just ${band.members} people.
  They recently released a new album "${band.albums.album1.name}" in ${band.albums.album1.released}, following the success of "${band.albums.album2.name}" released in ${band.albums.album2.released}. `;

// Don't edit the code below here!

const section = document.querySelector('section');
let para1 = document.createElement('p');
para1.textContent = bandInfo;
section.appendChild(para1);
Run Pen

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.