let pictures = [
  "dounat-1",
  "dounat-2",
  "dounat-3",
  "dounat-4",
  "dounat-5",
  "dounat-6"
];

let container = document.getElementsByClassName("container__item-second");

// 1. Pobieramy wszystkie notatki:
let third = document.querySelectorAll(".container__item-third");

let fir = document.getElementById("1");
let sec = document.getElementById("2");
let thi = document.getElementById("3");
let fort = document.getElementById("4");
let fif = document.getElementById("5");
let six = document.getElementById("6");

fir.addEventListener("click", function() {
  changeButton(
    document.getElementById("7"),
    document.getElementById("13"),
    pictures[0]
  );
});
sec.addEventListener("click", function() {
  changeButton(
    document.getElementById("8"),
    document.getElementById("14"),
    pictures[1]
  );
});
thi.addEventListener("click", function() {
  changeButton(
    document.getElementById("9"),
    document.getElementById("15"),
    pictures[2]
  );
});
fort.addEventListener("click", function() {
  changeButton(
    document.getElementById("10"),
    document.getElementById("16"),
    pictures[3]
  );
});
fif.addEventListener("click", function() {
  changeButton(
    document.getElementById("11"),
    document.getElementById("17"),
    pictures[4]
  );
});
six.addEventListener("click", function() {
  changeButton(
    document.getElementById("12"),
    document.getElementById("18"),
    pictures[5]
  );
});

function changeButton(idImg, idParagraf, img) {
  if (idImg.getAttribute("src") == "img/donut.png") {

// 2. Iterujemy po wszystkich notatkach, czyli pętlą for przeskakujemy po wszystkich i wszsytkim nadajemy "display: none"
    for (let i = 0; i < third.length; i++) {
      third[i].style = "display: none";
    }

    idImg.src = "img/" + img + ".jpg";

// 3. Do paragrafu który chcemy wyświetlic dodajemy display: block:
    idParagraf.style = "display: block";
    idParagraf.className = "container__item-third__visible";

    // let sib = this.nextElementSibling
    //sib.src="img/donut.png"
  } else {
    idImg.src = "img/donut.png";
    idParagraf.setAttribute("class", "container__item-third");
  }
}