---
id: 5d822fd413a79914d39e98e6
title: Part 30
challengeType: 0
dashedName: part-30
---
# --description--
Nest six `div` elements within `.foreground-buildings` and give them the classes of `fb1` through `fb6` in that order. "fb" stands for "foreground building". These will be six more buildings for the foreground.
# --hints--
You should create a new `div` with a class of `fb1`.
```js
assert.exists(document.querySelector('div.fb1'));
```
You should create a new `div` with a class of `fb2`.
```js
assert.exists(document.querySelector('div.fb2'));
```
You should create a new `div` with a class of `fb3`.
```js
assert.exists(document.querySelector('div.fb3'));
```
You should create a new `div` with a class of `fb4`.
```js
assert.exists(document.querySelector('div.fb4'));
```
You should create a new `div` with a class of `fb5`.
```js
assert.exists(document.querySelector('div.fb5'));
```
You should create a new `div` with a class of `fb6`.
```js
assert.exists(document.querySelector('div.fb6'));
```
You should place these new `div` elements within the `.foreground-buildings` element.
```js
assert.exists(document.querySelector('div.foreground-buildings > div.fb1'));
assert.exists(document.querySelector('div.foreground-buildings > div.fb2'));
assert.exists(document.querySelector('div.foreground-buildings > div.fb3'));
assert.exists(document.querySelector('div.foreground-buildings > div.fb4'));
assert.exists(document.querySelector('div.foreground-buildings > div.fb5'));
assert.exists(document.querySelector('div.foreground-buildings > div.fb6'));
```
You should place the new `div` elements in the correct order.
```js
function __t(a, b) {
return [...document.querySelector(a)?.nextElementSibling?.classList]?.includes(b);
}
assert(__t('div.fb1','fb2') && __t('div.fb2','fb3') && __t('div.fb3','fb4') && __t('div.fb4', 'fb5') && __t('div.fb5', 'fb6'));
```
# --seed--
## --seed-contents--
```html
freeCodeCamp Skyline Project