used ready html code

the same code from lesson 1

click Edit source(pencil icon),
paste the code below into editor field,
click Save changes(check mark icon)
1.js - there is the code for Lesson 1
(the function of creating an img in a div class wrap).

2.Add events click on these arrows to work with arrows 
for changing the display of the jpg file 

//add event click on arrow right
document.querySelector('.arrow.right').addEventListener('click', () => {
    //call a new function right
    changeImageRight();      
});
//add event click on arrow left
document.querySelector('.arrow.left').addEventListener('click', () => {
    //call a new function left
    changeImageLeft();      
});

3.Each event click will call its own function to change src-attribute

//click on arrow right - display nature_2.jpg
function changeImageRight() {
   document.querySelector('img').setAttribute('src', 'additional/img/nature_2.jpg');
}

//click on arrow left - display nature_1.jpg
function changeImageLeft() {
   document.querySelector('img').setAttribute('src', 'additional/img/nature_1.jpg');   
}