js/script.js
/*
Create the `showPage` function
This function will create and insert/append the elements needed to display a "page" of nine students
*/
Create the `showPage` function
This function will create and insert/append the elements needed to display a "page" of nine students
Create the ` showPage ` function This function will create and insert / append the elements needed to display a " page " of nine students
function showPage(list, page) {
  studentList.innerHTML = "";
  let startIndex = page * itemsPerPage - itemsPerPage;
  let endIndex = page * itemsPerPage;
  for (let i = startIndex; i < endIndex; i++) {
    if (i >= startIndex && i < endIndex) {
      let student = list[i];
      let html = `
         <li class="student-item cf">
         <div class="student-details">
           <img class="avatar" src="${student.picture.large}" alt="Profile Picture">
           <h3>${student.name.title} ${student.name.first} ${student.name.last}</h3>
           <span class="email">${student.email}</span>
         </div>
         <div class="joined-details">
           <span class="date">Joined ${student.registered.date}</span>
         </div>
       </li>`;
      studentList.insertAdjacentHTML("beforeend", html);
    }
  }
}
function showPage ( list , page ) { studentList . innerHTML = "" ; let startIndex = page * itemsPerPage - itemsPerPage ; let endIndex = page * itemsPerPage ; for ( let i = startIndex ; i < endIndex ; i ++ ) { if ( i >= startIndex && i < endIndex ) { let student = list [ i ] ; let html = ` ${ student . picture . large } ${ student . name . title } ${ student . name . first } ${ student . name . last } ${ student . email } ${ student . registered . date } ` ; studentList . insertAdjacentHTML ( "beforeend" , html ) ; } } }
Create the `showPage` function
This function will create and insert/append the elements needed to display a "page" of nine students
Create the ` showPage ` function This function will create and insert / append the elements needed to display a " page " of nine students
// list → represents student data that will be passed as an argument when showPage is called // page → represents the page number that will be passed as an argument when the showPage is called //clear html before inserting new HTML elements //insert student HTML elements