diff --git a/index.html b/index.html
index 0c4ad8e529a46ba9bff3c15ec1894a1748bf773e..ef118dca58740ac10c564936713d7a7b10c177a4 100644
--- a/index.html
+++ b/index.html
@@ -1,8 +1,13 @@
 <!DOCTYPE html>
 <html lang="en">
-  <head><title>TypeScript Dom Manipulation</title></head>
+  <head>
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+    
+    <title>TypeScript Dom Manipulation</title></head>
   <body>
-    <div id="app"></div>
+    <div id="app">
+      
+    </div>
     <!-- Assume index.js is the compiled output of index.ts -->
     <script src="index.js"></script>
     <script type="module" src="https://unpkg.com/@google/model-viewer/dist/model-viewer.min.js"></script>
diff --git a/index.js b/index.js
index 3179c79e3f00e8a8f6d3c53cbd9956ee7f54271c..4c6192dbb1427d41978fbcbe8113a39d5946e83d 100644
--- a/index.js
+++ b/index.js
@@ -1,8 +1,12 @@
 // 1. Select the div element using the id property
 const app = document.getElementById("app");
+const viewer = document.createElement("div");
+viewer.setAttribute("width", "500px");
+viewer.setAttribute("height", "500px");
+
 
 // 2. Create a new <p></p> element programmatically
-const description = document.createElement("p");
+const description = document.createElement("ul");
 const bucketpath = document.createElement("p");
 
 
@@ -11,11 +15,24 @@ const userAction = async () => {
     // fetch record json
     const response = await fetch('https://www.fdr.uni-hamburg.de/api/records/863');
     const recordjson = await response.json();
+    
 
     // read metadata from json response
     const metadata = recordjson.metadata;
-    description.textContent = metadata.description;
+    
+    var jsondescription = metadata.description;
+    var s = jsondescription.split("<p>");
+
+    var list = s[1].split("<br>")
+
+    list.forEach(element => {
+      var listnode = document.createElement("li");
+      var listtext = document.createTextNode(element.replace(/(<([^>]+)>)/gi, ""));
+      listnode.appendChild(listtext);
 
+      description.appendChild(listnode)
+    })
+    
     // get bucket path from record json
  
     const bucketresponse = await fetch(recordjson.links.bucket);
@@ -27,15 +44,13 @@ const userAction = async () => {
     {  
       if(element.key.includes('.glb'))
       {
-        console.log(element.key);
         const filelink = element.links.self;
-        console.log(filelink);
 
         const modelviewer = document.createElement("model-viewer");
         modelviewer.setAttribute("src", filelink);
         modelviewer.setAttribute("auto-rotate", true);
         modelviewer.setAttribute("camera-controls", true);
-        app?.appendChild(modelviewer);
+        viewer.appendChild(modelviewer);
         
       }
     });
@@ -45,3 +60,4 @@ const userAction = async () => {
 
 // 4. Append the p element to the div element
 app?.appendChild(description);
+app?.appendChild(viewer);