diff --git a/2-ui/1-document/07-modifying-document/1-createtextnode-vs-innerhtml/solution.md b/2-ui/1-document/07-modifying-document/1-createtextnode-vs-innerhtml/solution.md
@@ -1,8 +1,8 @@
-Answer: **1 and 3**.

-Both commands result in adding the `text` "as text" into the `elem`.

-Here's an example:

```html run height=80
<div id="elem1"></div>

diff --git a/2-ui/1-document/07-modifying-document/1-createtextnode-vs-innerhtml/task.md b/2-ui/1-document/07-modifying-document/1-createtextnode-vs-innerhtml/task.md
@@ -4,9 +4,9 @@ importance: 5

# createTextNode vs innerHTML vs textContent

-We have an empty DOM element `elem` and a string `text`.

-Which of these 3 commands do exactly the same?

1. `elem.append(document.createTextNode(text))`
2. `elem.innerHTML = text`

diff --git a/2-ui/1-document/07-modifying-document/10-clock-setinterval/solution.md b/2-ui/1-document/07-modifying-document/10-clock-setinterval/solution.md
@@ -1,16 +1,16 @@
-First, let's make HTML/CSS.

-Each component of the time would look great in its own `<span>`:

```html
<div id="clock">
  <span class="hour">hh</span>:<span class="min">mm</span>:<span class="sec">ss</span>
</div>
```

-Also we'll need CSS to color them.

-The `update` function will refresh the clock, to be called by `setInterval` every second:

```js
function update() {
@@ -32,14 +32,14 @@ function update() {
}
```

-In the line `(*)` we every time check the current date. The calls to `setInterval` are not reliable: they may happen with delays.

-The clock-managing functions:

```js
let timerId;

-function clockStart() { // run the clock
  timerId = setInterval(update, 1000);
  update(); // (*)
}
@@ -50,4 +50,4 @@ function clockStop() {
}
```

-Please note that the call to `update()` is not only scheduled in `clockStart()`, but immediately run in the line `(*)`. Otherwise the visitor would have to wait till the first execution of `setInterval`. And the clock would be empty till then.
diff --git a/2-ui/1-document/07-modifying-document/10-clock-setinterval/task.md b/2-ui/1-document/07-modifying-document/10-clock-setinterval/task.md
@@ -2,10 +2,10 @@ importance: 4

---

-# Colored clock with setInterval

-Create a colored clock like here:

[iframe src="solution" height=60]

-Use HTML/CSS for the styling, JavaScript only updates time in elements.
diff --git a/2-ui/1-document/07-modifying-document/11-append-to-list/solution.md b/2-ui/1-document/07-modifying-document/11-append-to-list/solution.md
@@ -1,7 +1,7 @@

-When we need to insert a piece of HTML somewhere, `insertAdjacentHTML` is the best fit.

-The solution:

```js
one.insertAdjacentHTML('afterend', '<li>2</li><li>3</li>');

diff --git a/2-ui/1-document/07-modifying-document/11-append-to-list/task.md b/2-ui/1-document/07-modifying-document/11-append-to-list/task.md
@@ -2,9 +2,9 @@ importance: 5

---

-# Insert the HTML in the list

-Write the code to insert `<li>2</li><li>3</li>` between two `<li>` here:

```html
<ul id="ul">

diff --git a/2-ui/1-document/07-modifying-document/12-sort-table/solution.md b/2-ui/1-document/07-modifying-document/12-sort-table/solution.md
@@ -1,4 +1,4 @@
-The solution is short, yet may look a bit tricky, so here I provide it with extensive comments:

```js
let sortedRows = Array.from(table.tBodies[0].rows) // 1
@@ -7,12 +7,12 @@ let sortedRows = Array.from(table.tBodies[0].rows) // 1
table.tBodies[0].append(...sortedRows); // (3)
```

-The step-by-step algorthm:

-1. Get all `<tr>`, from `<tbody>`.
-2. Then sort them comparing by the content of the first `<td>` (the name field).
-3. Now insert nodes in the right order by `.append(...sortedRows)`.

-We don't have to remove row elements, just "re-insert", they leave the old place automatically.

-P.S. In our case, there's an explicit `<tbody>` in the table, but even if HTML table doesn't have `<tbody>`, the DOM structure always has it.
diff --git a/2-ui/1-document/07-modifying-document/4-clear-elem/solution.md b/2-ui/1-document/07-modifying-document/4-clear-elem/solution.md
@@ -1,5 +1,5 @@

-First, let's see how *not* to do it:

```js
function clear(elem) {
@@ -9,11 +9,11 @@ function clear(elem) {
}
```

-That won't work, because the call to `remove()` shifts the collection `elem.childNodes`, so elements start from the index `0` every time. But `i` increases, and some elements will be skipped.

-The `for..of` loop also does the same.

-The right variant could be:

```js
function clear(elem) {
@@ -23,7 +23,7 @@ function clear(elem) {
}
```

-And also there's a simpler way to do the same:

```js
function clear(elem) {

diff --git a/2-ui/1-document/07-modifying-document/5-why-aaa/solution.md b/2-ui/1-document/07-modifying-document/5-why-aaa/solution.md
@@ -1,9 +1,9 @@
-The HTML in the task is incorrect. That's the reason of the odd thing.

-The browser has to fix it automatically. But there may be no text inside the `<table>`: according to the spec only table-specific tags are allowed. So the browser adds `"aaa"` *before* the `<table>`.

-Now it's obvious that when we remove the table, it remains.

-The question can be easily answered by exploring the DOM using the browser tools. It shows `"aaa"` before the `<table>`.

-The HTML standard specifies in detail how to process bad HTML, and such behavior of the browser is correct.
diff --git a/2-ui/1-document/07-modifying-document/5-why-aaa/task.md b/2-ui/1-document/07-modifying-document/5-why-aaa/task.md
@@ -2,13 +2,13 @@ importance: 1

---

-# Why does "aaa" remain?

-In the example below, the call `table.remove()` removes the table from the document.

-But if you run it, you can see that the text `"aaa"` is still visible.

-Why does that happen?

```html height=100 run
<table id="table">
@@ -19,9 +19,9 @@ Why does that happen?
</table>

<script>
-  alert(table); // the table, as it should be

  table.remove();
-  // why there's still aaa in the document?
</script>
```
diff --git a/2-ui/1-document/07-modifying-document/6-create-list/solution.md b/2-ui/1-document/07-modifying-document/6-create-list/solution.md
@@ -1 +1 @@
-Please note the usage of `textContent` to assign the `<li>` content.
diff --git a/2-ui/1-document/07-modifying-document/6-create-list/task.md b/2-ui/1-document/07-modifying-document/6-create-list/task.md
@@ -2,18 +2,18 @@ importance: 4

---

-# Create a list

-Write an interface to create a list from user input.

-For every list item:

-1. Ask a user about its content using `prompt`.
-2. Create the `<li>` with it and add it to `<ul>`.
-3. Continue until the user cancels the input (by pressing `key:Esc` or CANCEL in prompt).

-All elements should be created dynamically.

-If a user types HTML-tags, they should be treated like a text.

[demo src="solution"]
diff --git a/2-ui/1-document/07-modifying-document/7-create-object-tree/solution.md b/2-ui/1-document/07-modifying-document/7-create-object-tree/solution.md
@@ -1,4 +1,4 @@
-The easiest way to walk the object is to use recursion.

-1. [The solution with innerHTML](sandbox:innerhtml).
-2. [The solution with DOM](sandbox:build-tree-dom).
diff --git a/2-ui/1-document/07-modifying-document/7-create-object-tree/task.md b/2-ui/1-document/07-modifying-document/7-create-object-tree/task.md
@@ -2,11 +2,11 @@ importance: 5

---

-# Create a tree from the object

-Write a function `createTree` that creates a nested `ul/li` list from the nested object.

-For instance:

```js
let data = {
@@ -28,24 +28,24 @@ let data = {
};
```

-The syntax:

```js
let container = document.getElementById('container');
*!*
-createTree(container, data); // creates the tree in the container
*/!*
```

-The result (tree) should look like this:

[iframe border=1 src="build-tree-dom"]

-Choose one of two ways of solving this task:

-1. Create the HTML for the tree and then assign to `container.innerHTML`.
-2. Create tree nodes and append with DOM methods.

-Would be great if you could do both.

-P.S. The tree should not have "extra" elements like empty `<ul></ul>` for the leaves.
diff --git a/2-ui/1-document/07-modifying-document/8-tree-count/solution.md b/2-ui/1-document/07-modifying-document/8-tree-count/solution.md
@@ -1 +1 @@
-To append text to each `<li>` we can alter the text node `data`.
diff --git a/2-ui/1-document/07-modifying-document/9-calendar-table/task.md b/2-ui/1-document/07-modifying-document/9-calendar-table/task.md
@@ -2,16 +2,16 @@ importance: 4

---

-# Create a calendar

-Write a function `createCalendar(elem, year, month)`.

-The call should create a calendar for the given year/month and put it inside `elem`.

-The calendar should be a table, where a week is `<tr>`, and a day is `<td>`. The table top should be `<th>` with weekday names: the first day should be Monday, and so on till Sunday.

-For instance, `createCalendar(cal, 2012, 9)` should generate in element `cal` the following calendar:

[iframe height=210 src="solution"]

-P.S. For this task it's enough to generate the calendar, should not yet be clickable.
-Original file line number
+Diff line change
@@ Expand Up / @@ -2,9 +2,9 @@ importance: 5 @@
     ---
-    # Insert the HTML in the list
-    Write the code to insert `<li>2</li><li>3</li>` between two `<li>` here:
     ```html
     <ul id="ul">
@@ Expand Down @@
Original file line number	Diff line number	Diff line change
		@@ -1 +1 @@
		Please note the usage of `textContent` to assign the `<li>` content.
Original file line number	Diff line number	Diff line change
		@@ -1 +1 @@
		To append text to each `<li>` we can alter the text node `data`.