JSFiddle - React, Tailwind, and code Playground

by Angeli Schwartz

HTML

</div><div>GiveAways &
Sponsors<br>WIN a Car
Vacation for 2
Dinner for 2
Tickets for 2 </div>
<div>Abby & Cera together with our business partners will grant you 100 IC Points simply because you love San Diego like the rest of the 1,322,533 current residents.

Want to earn more points, cash or rewards? Invite your friends to join us while we extend you with more points that you can redeem thru your neigborhood restaurants, shops, travel or see a show. </div>
<div>PICTURE</div>
<div>JOIN & share your skills/talents through your choice of social networking tools. Show your recent meal, home made or store bought; restaurant experience with friends or significant someone; recent store or online purchase; entertainment or social activity.

Save money, earn rewards & garner points thru our business affiliate,      
We will show you an innovative way to reach & build your important contacts; form or join a clique, collaborate and meet new friends while you take advantage of our daily deals through this site.</div>

CSS

div {
    margin: 1000px;
    width:185px;
    color: #333333;
    height:300px;
    background-color:white;
    margin:5px;
    float:left;
    text-align:left;
}

secondColumn{
  color: grey;
  
}

JavaScript

// get all div tags into an array-like structure
divs = document.getElementsByTagName('div');
			
// add an event listener to each div square. the goal is that if a
// user clicks on the 2nd square,
// the alert box should say 2. if the user clicks on the 5th square,
// it should say 5
// though this doesn't happen with the below code. why?
for(i=0;i<divs.length;i++) {
    divs[i].onclick = (function() {
        var myNum = i;
        return function() {
           alert("Click handler: " + myNum);
        };
    })();
}