` is where we will put all the messages. It is empty because the messages will be created dynamically using Javascript!
The posts container is wrapped by `
`. This div acts as a container for other elements that we will add in the future, and helps to better style and position its content. `container` is a class used by Bootstrap.
> [What is a `
`?](https://developer.mozilla.org/en/docs/Web/HTML/Element/div)
*0.4 — The script that creates a post*
```markup
```
In order to create the first post, we split the code in two parts:
* A generic `drawElement` function that appends some HTML to the posts container, customised with the provided message details
* A call to the `drawElement` function with the actual message data
> [How do I use functions?](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Functions)
*0.4.1 — The `drawElement` function*
What is the function actually doing?
```javascript
var postContainer = document.querySelector('#posts');
```
The first line of `drawElement` gets the reference to the posts container.
> [How does document.querySelector() work?](https://developer.mozilla.org/en-US/docs/Web/API/Document/querySelector)
>
> [What syntax can I use with a query selector?](https://developer.mozilla.org/en-US/docs/Web/Guide/CSS/Getting_Started/Selectors)
```javascript
postContainer.innerHTML +=
'
' +
'
' +
post.title +
'
' +
'
' +
post.body +
'
' +
'
';
```
The second part does a couple of things:
* It concatenates a set of strings, some of which (title and body) are properties of the `post` input parameter
* It appends the concatenated string to the post container as HTML
> [What are `panel` and the other `panel-` classes?](http://getbootstrap.com/components/#panels)
*0.4.2 — The initialisation code*
In order to create the message, we call the `drawElement` function and pass the message data as parameter.
```javascript
var postToAdd = { title: 'new post', body: 'This is a message..' };
```
The message data is a Javascript object. It contains two properties, `title` and `body`.
> [What are Javascript objects?](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Working_with_Objects)
```javascript
drawElement(postToAdd);
```
The second line contains the call to the `drawElement` function!
---
# Agent Instructions: Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.
Perform an HTTP GET request on the current page URL with the `ask` query parameter:
```
GET https://bootcamp.shetechitaly.org/day2/02-01.md?ask=
```
The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.
Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.