Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

JavaScript

Posted by Hariidaran Tamilmaran
.a{fill-rule:evenodd;}techdegree
Hariidaran Tamilmaran
iOS Development Techdegree Student 19,305 Points

Endless Loop

Can someone please help? The code below compiles into an endless loop.

index.html 
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8">
    <title>Stuff</title>
    <link rel="stylesheet" href="style.css">
  </head>
  <body id="color">
    <h1>Stuff You Do NOT Know</h1>
    <script src="script.js"></script>
  </body>
</html>
style.css 
@import url('http://necolas.github.io/normalize.css/3.0.2/normalize.css');

/*General*/
body {
  background: #fff;
  max-width: 980px;
  margin: 50px auto;
  padding: 0 20px;
  font: Helvetica Neue, Helvectica, Arial, serif;
  font-weight: 300;
  font-size: 1em;
  line-height: 1.5em;
  color: #8d9aa5;
}

a {
  color: #3f8aBf;
  text-decoration: none;
}

a:hover {
  color: #3079ab;
}

a:visited {
  color: #5a6772;
}

h1, h2, h3 {
  font-weight: 500;
  color: #384047;
}

h1 {
  font-size: 1.8em;
  margin: 60px 0 40px;
}

h2 {
    font-size: 1em;
    font-weight: 300;
    margin: 0;
    padding: 10px 0 30px 0;
}


h3 {
  font-size: .9em;
  font-weight: 300;
  margin: 0;
  padding: 0;
}

h3 em {
  font-style: normal;
  font-weight: 300;
  margin: 0 0 10px 5px;
  padding: 0;
  color: #8d9aa5;
}

ol {
  margin: 0 0 20px 32px;
  padding: 0;
}


.lens {
  display: inline-block;
  width: 0;
  height: 0;
  border-top: 8px solid transparent;
  border-bottom: 8px solid transparent;
  border-right: 8px solid #8d9aa5;
  border-radius: 5px;
  position: absolute;
  margin: 5px 0 0 -19px;
}

#color div {
  box-sizing: border-box;
  padding-top: 12px;
  text-align: center;
  width: 50px;
  height: 50px;
  display: inline-block;
  border-radius: 50%;
  margin: 5px;
  background-color: rgb(230,230,230);
}

span {
  color: red;
}
script.js 
var playList = [
  ['Lamborghini', 'KSI'],
  ['Ronaldo Chop', 'Joe Weller'],
  ['Demons', 'Imagine Dragons'],
  ['Counting Stars', 'OneRepublic'],
  ['Animals', 'Maroon 5'],
  ['Fix You', 'Coldplay']
];

function print( message ) {
  document.write( message );
}

function printSongs( songs ) {
  var listHTML = "<ol>";
  for ( var i = 0; i < songs.length; songs += 1 ) {
    listHTML += "<li>" + songs[i][0] + " by " + songs[i][1] + "</li>";
  }
  listHTML += "</ol>";
  print( listHTML );
}

printSongs( playList );

1 Answer

Dan Garrison
Dan Garrison
22,457 Points

In your for loop it should be i += 1 not songs += 1.

Right now it isn't ending because your counter isn't incrementing.

Hariidaran Tamilmaran
.a{fill-rule:evenodd;}techdegree
Hariidaran Tamilmaran
iOS Development Techdegree Student 19,305 Points

Thanks Dan! I totally did not notice that one!