diff --git a/src/app.js b/src/app.js
index cc43cc2..18ce5aa 100644
--- a/src/app.js
+++ b/src/app.js
@@ -26,15 +26,35 @@ const initPlayers = (players) => {
     let detailedPlayers = [];
     // Create players using for loop
     // Type your code here
+     for (var i = 0; i < players.length; i++) {
+        detailedPlayers[i] = {
+          name: players[i],
+          strength: getRandomStrength(),
+          image: "./images/super-" + (i + 1) + ".png",
+        };
+        if (i % 2 == 0) {
+          detailedPlayers[i].type = "hero";
+        } else {
+          detailedPlayers[i].type = "villain";
+        }
 
     return detailedPlayers;
 }
+    function herovillian(n) {
+    if (n % 2 == 0) {
+        return "hero";
+    } else {
+        return "villain";
+    }
+}
 
 // getting random strength
 const getRandomStrength = () => {
     // Return a random integer (0,100]
     // Note: You can use Math.random() and Math.ceil()
-}
+    let s = Math.ceil(Math.random() * (100 - 1) + 1);
+    return s;
+};
 
 const buildPlayers = (players, type) => {
     let fragment = '';
@@ -42,9 +62,14 @@ const buildPlayers = (players, type) => {
     // Loop through players and accumulate HTML template
     // depending of type of player(hero|villain)
     // Type your code here
+    for (var i = 0; i < players.length; i++) {
+        if (players[i].type == type) {
+          fragment += `<div class="player"> <img src="${players[i].image}" alt=""> <div class="name">${players[i].name}</div> <div class="strength">${players[i].strength}</div> </div>`;
+        }
+      }
 
     return fragment;
-}
+};
 // Display players in HTML
 const viewPlayers = (players) => {
 
@@ -55,4 +80,4 @@ const viewPlayers = (players) => {
 
 window.onload = () => {
     viewPlayers(initPlayers(PLAYERS));
-}
\ No newline at end of file
+}