Thinkful List Template

index.html

<div id="wrapper"><section id="important-events">
      <h1>Top 10 Important Events in US History!</h1>
      <p>This list takes a look at the 10 most seminal, historical and influential events in the evolution of the United States of America. The lister tried to include 5 good and 5 bad events, but the bad won the numbers game. Readers of other nations are
        encouraged to submit lists of their own nations’ most important events. For the full text look on listverse <a href="http://listverse.com/2011/07/14/top-10-important-events-in-us-history/" target="_blank">here</a>
      </p>
      <ul>
        <li>
          <p><span>10</span> Assassination of Abraham Lincoln</p>
          <figure>
            <img src="http://i2.wp.com/listverse.com/wp-content/uploads/2011/07/guelzo_fig01b.jpg?resize=263%2C400" alt="">
            <figcaption></figcaption>
          </figure>
          <p>In hindsight, this seems the only way America’s worst moment could end. After some 600,000 American men had died of wounds, or grossly unsanitary medical practice, Lincoln gave his second inaugural address, the famous “charity for all” speech,
            on March 4, 1865, one month before his death. There is a photograph of him giving this speech, which also shows John Wilkes Booth standing above and behind him, on a balcony. Lincoln ended his speech with these words: “With malice toward none;
            with charity for all;…let us strive on to finish the work we are in; to bind up the nation’s wounds; to care for him who shall have borne the battle, and for his widow, and his orphan.”</p>
        </li>
        <li>
          <p><span>9</span> Louisiana Purchase</p>
          <figure>
            <img src="http://i2.wp.com/listverse.com/wp-content/uploads/2011/07/screen-shot-2011-07-14-at-2-51-34-pm.jpg?resize=550%2C345" alt="">
            <figcaption></figcaption>
          </figure>
          <p>It’s been mentioned more than once before on Listverse, and you’re probably familiar with it anyway, but let us not forget that with one shrewd business deal, Thomas Jefferson doubled the United States of America’s area. The U. S. paid 60 million
            francs, and canceled French debts totaling another 18 million, for a grand total of 78 million francs, or about $15 million. Today, that would be worth about $220 million, which is an extraordinarily good sale price for 828,800 square miles.</p>
        </li>
        <li>
          <p><span>8</span> Manhattan Project</p>
          <figure>
            <img src="http://i1.wp.com/listverse.com/wp-content/uploads/2011/07/14560257.jpg?resize=290%2C400" alt="">
            <figcaption></figcaption>
          </figure>
          <p>It is risky to take pride in weaponry, lest doing so lead people to believe that the proud are villains. America is not a land of evil people. But like all nations of peoples, Americans are warlike, and proud of their almighty ability to defend
            themselves “against all enemies, foreign and domestic.”</p>
        </li>
        <li>
          <p><span>7</span> Vietnam War</p>
          <figure>
            <img src="http://i0.wp.com/listverse.com/wp-content/uploads/2011/07/protexst.jpg?resize=550%2C419" alt="">
            <figcaption></figcaption>
          </figure>
          <p>In many ways, the Vietnam War was a product of decades of lousy politics, not just American, but including the global spread of Communism. Communism works on paper, but when you add human desires to it, it fails. But America entered the Vietnam
            conflict largely because it felt threatened by Communism’s spread into democratic South Vietnam, and has sworn to defend democracy.</p>
        </li>
        <li>
          <p><span>6</span> Death of Osama bin Laden</p>
          <figure>
            <img src="http://i0.wp.com/listverse.com/wp-content/uploads/2011/07/osama-bin-laden-with-gun.jpg?resize=550%2C368" alt="">
            <figcaption></figcaption>
          </figure>
          <p>Adolf Hitler and Josef Stalin had, until bin Laden’s death, been without parallel in the world’s opinion of villainy. They were absolute evils, universally despised except by very small numbers of fanatics whose philosophy no one has ever taken
            seriously. Bin Laden’s status the world over was virtually equivalent to this. He still has plenty of supporters, most of them in various places throughout the Middle East, but their percentage is microscopic compared to the favorable response
            to his death on May 1, 2011. And it was the United States military, without help from anyone else, that did it.</p>
        </li>
        <li>
          <p><span>5</span> Assassination of John F. Kennedy</p>
          <figure>
            <img src="http://i0.wp.com/listverse.com/wp-content/uploads/2011/07/john-f-kennedy.jpg?resize=550%2C366" alt="">
            <figcaption></figcaption>
          </figure>
          <p>The jury is still out, and probably will be for a very long time, as to why in the world Kennedy had to die. There are loads of conspiracy theories, most centering on the Chicago mafia. Sam Giancana is thought to have rigged the election to
            get Kennedy into the Office, but why he did this is a long, complicated story. In general, Giancana believed his interests would fare better under Kennedy. The answer is almost always money.</p>
        </li>
        <li>
          <p><span>4</span> The American Revolution</p>
          <figure>
            <img src="http://i0.wp.com/listverse.com/wp-content/uploads/2011/07/21836221.jpg?resize=550%2C292" alt="">
            <figcaption></figcaption>
          </figure>
          <p>The establishment of America as a nation all its own occurred from 19 April 1775 to October 1781. Hostilities were required because the British considered the Thirteen Colonies nothing more than another exclave of the global British Empire,
            and King George wanted the lion’s share of all the Colonies’ wealth. America’s Founding Fathers had had enough, and when 8 Minutemen were killed on Lexington Green, the fight was on.</p>
        </li>
        <li>
          <p><span>3</span> The Civil War</p>
          <figure>
            <img src="http://i0.wp.com/listverse.com/wp-content/uploads/2011/07/index-lg.jpg?resize=548%2C300" alt="">
            <figcaption></figcaption>
          </figure>
          <p>This war ranks higher than that of #3 because #3 left one question unanswered after the drafting of the Constitution: if all men are created equal, why are blacks bought and sold, families of them broken up, and in other ways inhumanely treated
            for the purpose of using them like farm animals? Why aren’t blacks allowed to vote? Are they, at long last, men?</p>
        </li>
        <li>
          <p><span>2</span> September 11, 2001</p>
          <figure>
            <img src="http://i0.wp.com/listverse.com/wp-content/uploads/2011/07/911statueoflibertyandwthx6.jpg?resize=548%2C361" alt="">
            <figcaption></figcaption>
          </figure>
          <p>The current global generation’s “JFK moment” took place on a Tuesday morning, when Islamic extremists indoctrinated (brainwashed) by Osama bin Laden hijacked 4 commercial passenger jets and deliberately flew them into major American landmarks.
            Their sole intent was indiscriminate mass murder, for the purpose of causing as much physical, emotional, mental, psychological and financial harm on America as they possibly could. Their motives were, and still are, convoluted, complicated,
            and completely spurious. America is not the Great Satan some in the Middle East have made it out to be.</p>
        </li>
        <li>
          <p><span>1</span> Apollo 11</p>
          <figure>
            <img src="http://i1.wp.com/listverse.com/wp-content/uploads/2011/07/appollo11.jpg?resize=550%2C442" alt="">
            <figcaption></figcaption>
          </figure>
          <p>For once, we will end on a major chord. In just about a week we remember the significant events of July 20, 1969, when humanity did itself proud, in spite of all its wars, sadism, hatred, and insanity. We set foot on another world. We have no
            choice but to remember the awful things our species has perpetrated on itself and on Planet Earth. But we can now choose to think of ourselves as ultimately good. Beneath it all, we are a decent species. We did not, until this date, possess
            or even deserve a universal common ground on which to agree. Now, no matter what else happens, if extraterrestrial life ever learns of us, they will learn that we walked on our own moon, studied it up close and personal, and returned safe
            and sound.
          </p>
        </li>
      </ul>
    </section>
    <section id="unimportant-events">
      <h1>Lorem ipsum dolor sit amet.</h1>
      <p>Donec fermentum lorem non venenatis varius. Suspendisse ac condimentum lorem, at condimentum mi. Sed blandit mi vitae mauris cursus facilisis. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Vivamus volutpat
        sed neque tincidunt semper.</p>
      <ul>
        <li>
          <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus pretium, ligula sit amet pulvinar accumsan, diam sapien maximus velit, sit amet accumsan odio nisi quis odio. Donec fermentum lorem non venenatis varius. Suspendisse ac condimentum
            lorem, at condimentum mi. Sed blandit mi vitae mauris cursus facilisis. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Vivamus volutpat sed neque tincidunt semper.</p>
        </li>
        <li>
          <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus pretium, ligula sit amet pulvinar accumsan, diam sapien maximus velit, sit amet accumsan odio nisi quis odio. Donec fermentum lorem non venenatis varius. Suspendisse ac condimentum
            lorem, at condimentum mi. Sed blandit mi vitae mauris cursus facilisis. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Vivamus volutpat sed neque tincidunt semper.</p>
        </li>
        <li>
          <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus pretium, ligula sit amet pulvinar accumsan, diam sapien maximus velit, sit amet accumsan odio nisi quis odio. Donec fermentum lorem non venenatis varius. Suspendisse ac condimentum
            lorem, at condimentum mi. Sed blandit mi vitae mauris cursus facilisis. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Vivamus volutpat sed neque tincidunt semper.</p>
        </li>
        <li>
          <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus pretium, ligula sit amet pulvinar accumsan, diam sapien maximus velit, sit amet accumsan odio nisi quis odio. Donec fermentum lorem non venenatis varius. Suspendisse ac condimentum
            lorem, at condimentum mi. Sed blandit mi vitae mauris cursus facilisis. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Vivamus volutpat sed neque tincidunt semper.</p>
        </li>
        <li>
          <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus pretium, ligula sit amet pulvinar accumsan, diam sapien maximus velit, sit amet accumsan odio nisi quis odio. Donec fermentum lorem non venenatis varius. Suspendisse ac condimentum
            lorem, at condimentum mi. Sed blandit mi vitae mauris cursus facilisis. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Vivamus volutpat sed neque tincidunt semper.</p>
        </li>
      </ul>
    </section>
  </div>

script.js

$(document).ready(function() {
  console.log("Ready!");
});

$('#important-events h1').css('background-color', 'teal');

$("#unimportant-events h1").css("background-color", "indianred");

$('#important-events ul').css("background-color", "steelblue")	

$( "section#wrapper > p" ).css("background-color", "blue");

style.css

#wrapper > p {
  background-color: purple;
}

Thinkful List Template.markdown

Thinkful List Template ('-' * 22)

Forked from Martin's Pen Thinkful List Template.

A Pen by Bryan Swagerty on CodePen.

License.