title: Open Weather Api (Show weather icon)
body: <p>Hello community back to you again. I am playing with the openweather API and i am building a simple weather app. I have an issue and i can't show the weather conditions icon for each city.</p>
  
  <p>I pushed every icon id in a newArray and i am trying to show it using the url but without luck <a href="http://openweathermap.org/img/w/10d.png" rel="nofollow noreferrer">http://openweathermap.org/img/w/10d.png</a></p>
  
  <p>Any suggestion?Thanks in advance</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>var app = new Vue({
   el: "#app",
   data: {
  
    test: [],
    image: [],
    newArray:[],
    message: "",
    url: "",
    
   },
   created: function () {
    this.getData();
    this.cities();
   
    },
          methods: {
    getData: function () {
     var fetchConfig =
      fetch("https://api.myjson.com/bins/i8run", {
       method: "GET",
       headers: new Headers({})
      }).then(function (response) {
       if (response.ok) {
        return response.json();
       }
      }).then(function (json) {
       console.log("My json", json)
  
       app.test = json.list;
       console.log(app.test);
            app.pushAnArr();
     
  
      })
      .catch(function (error) {
       console.log(error);
      })
    },
     
    cities: function () {
     var fetchConfig =
      fetch("https://pixabay.com/api/?key=10772849-8270b213e517e422b036ea0fd&amp;q=city", {
       method: "GET",
       headers: new Headers({})
      }).then(function (response) {
       if (response.ok) {
        return response.json();
       }
      }).then(function (json) {
       console.log("My json", json)
  
       app.image = json.hits;
       console.log(app.image);
      
  
      })
      .catch(function (error) {
       console.log(error);
      })
    },
     
    pushAnArr: function(){
    for(var i=0; i&lt;app.test.length; i++){
     
     app.newArray.push(app.test[i].weather[0].icon);
     
     
    }
        console.log(app.newArray); 
  
    
    }
     
     
   }
  })
  
   </code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;!DOCTYPE html&gt;
  &lt;html lang="en"&gt;
  &lt;head&gt;
   &lt;meta charset="UTF-8"&gt;
   &lt;title&gt;Document&lt;/title&gt;
    &lt;link rel="stylesheet" type="text/css" href="style.css"&gt;
  &lt;/head&gt;
  &lt;body&gt;
      &lt;div id="app"&gt;
     &lt;div v-for="item in newArray" :key="item.id" class="thecard"&gt;
                        {{item}}
         &lt;img src="http://openweathermap.org/img/w/item.png" &gt;
          &lt;/div&gt;
                  
   &lt;/div&gt;
  
    
  
  
    
   &lt;script src="https://unpkg.com/vue/dist/vue.js"&gt;&lt;/script&gt;
      &lt;script src="main.js"&gt;&lt;/script&gt;
  &lt;/body&gt;
  &lt;/html&gt;</code></pre>
  </div>
  </div>
  </p>