please help, i am still a novice resolve my code issue:

Use Moustache.js template to design layout for search results, individual book information, and bookshelf items.

Display the research results in two view layouts (grid view and list view).

A user can switch between two layouts dynamically.

With each search result item, clicking on the item will display more detailed book information of the selected book on the same page. Apply one of the details-on-demand patterns mentioned in module #9.

Apply paging, continuous scroll, or slideshow pattern to display more data.

Book details functionality: to display all information about a single book.

Display as many details as you can about a single book (examine the JSON content).

Organize the information in a decent clean style/layout.

Here is code:

body{

background:lightblue

}

.wrap{

max-width:400px;

margin:auto;

margin-top:10px;

}

.pagination, pagination-last{

float:left;

}

a{

text-decoration:none;

padding:15px 20px;

border:1px solid black;

border-right:none;

background:#f2f2f2;

font-size:18px;

font-weight:bold;

}

.pagination-last a{

border-right:1px solid black;

}

a:hover {

background:orange;

color;white;

}

function B_Search() {

var search = document.getElementById('search').value;

var result = document.getElementById('results');

var resultString = "";

console.log(search);

$.ajax({

url: "https://www.googleapis.com/books/v1/volumes?q=id:"+ search,

dataType: "json",

success: function(data) { console.log(data);

for (i = 0; i

resultString += "

" + data.items[i].volumeInfo.title + "

";

resultString += "

" + data.items[i].volumeInfo.authors + "

";

resultString += "

Publisher: " + data.items[i].volumeInfo.publisher + "

";

resultString += "

publishedDate: " + data.items[i].volumeInfo.publishedDate + "

";

resultString += "

Description: " + data.items[i].volumeInfo.description + "

";

resultString += '

';

if (data.items[i].saleInfo.saleability == "FOR SALE") {

resultString += "

Price: " + data.items[i].saleInfo.retailPrice.amount + data.items[i].saleInfo.retailPrice.currencyCode + "

";

}

else {

resultString += "

Not for Sale

"

} } result.innerHTML = resultString; },

type: 'GET'

});

}

Book Search

1

2

3

4

5

body {

background-image: url("image1.jpg");

;

}

h1 {

background-color: green;

}