Rough in the Huckleberry div. Style article bottoms.

data/quiltContent.mjs

@@ -2,32 +2,19 @@ console.log('start quiltdata.');
 
 
 /*****
+To add a section:
+1. After testing html in staging.html, paste it into an object below, here, as answerHTML.
+2. Then make a file and function with that same name and save it.
+3. Finally include it in the html.
+
 Don't arbitrarily edit the title!
 
 It is important that you use the same string for the following three things:
 TITLE (as title case with spaces allowed) & javascriptfile (camelcased) & the id of the div for inserting the solution code (same as the javascript file name)
 For example, if the title is Max End 3, the file is maxEnd3.mjs and the div will be <div id="maxEnd"></div>
 ******/
 let articles = [
-{
-    backgroundColor: '#930',
-    textColor: '#ffa',
-    title: 'Team Pitching',
-    question: 'Statistics from <a href="https://www.baseball-reference.com/leagues/majors/2021-standard-pitching.shtml">Baseball Reference</a>',
-    strategy: 'null',
-    form: '<form><h1>Placeholder</h1><button>click</button></form>',
-    linkToCodeRepo: 'https://github.com/atom-box/codingBatJS/blob/master/textSimilarity.html',
-    testElement: '<p class="blueBackground">dogfish - dogfish - dogfish - dogfish </p>',
-    inputs: [],
-    predictedOutputs: [],
-    answerHtml:
-    `
-    <button type="button" class="btn btn-primary btn-sm" onclick="teamPitching()" > five</button>
-    `,
 
-    // <p>${teamPitching()} all day, every day</p>
-
-},
 {
     backgroundColor: '#256',
     textColor: '#db5',
@@ -52,6 +39,28 @@ let articles = [
 </div>
     `
 },
+
+
+{
+    backgroundColor: '#037',
+    textColor: '#ff0',
+    title: 'Word Checker',
+    question: 'Analyze Chapter 3 of <a href="https://etc.usf.edu/lit2go/21/the-adventures-of-huckleberry-finn/116/chapter-3/">Huckleberry Finn</a> by Mark Twain.',
+    strategy: 'null',
+    form: '<form><h1>Placeholder</h1><button>click</button></form>',
+    linkToCodeRepo: 'https://github.com/atom-box/codingBatJS/blob/master/textSimilarity.html',
+    testElement: '<p class="blueBackground">dogfish - dogfish - dogfish - dogfish </p>',
+    inputs: [],
+    predictedOutputs: [],
+    answerHtml:
+    `
+    <button type="button" class="btn btn-secondary" onclick="wordChecker()" > Go </button>
+    `,
+
+    // <p>${teamPitching()} all day, every day</p>
+
+},
+
 {
     backgroundColor: '#493',
     textColor: '#ddf',
@@ -64,9 +73,36 @@ let articles = [
     inputs: [],
     predictedOutputs: [],
     answerHtml:
-    `<button type="button" class="btn btn-primary btn-sm" onclick="dice.show5()" > five</button>`,
+    `
+   <p>Coming soon...</p>
+    `,
+},
+
+
+
+{
+    backgroundColor: '#930',
+    textColor: '#ffa',
+    title: 'Team Pitching',
+    question: 'Statistics from <a href="https://www.baseball-reference.com/leagues/majors/2021-standard-pitching.shtml">Baseball Reference</a>',
+    strategy: 'null',
+    form: '<form><h1>Placeholder</h1><button>click</button></form>',
+    linkToCodeRepo: 'https://github.com/atom-box/codingBatJS/blob/master/textSimilarity.html',
+    testElement: '<p class="blueBackground">dogfish - dogfish - dogfish - dogfish </p>',
+    inputs: [],
+    predictedOutputs: [],
+    answerHtml:
+    `
+   <p>Coming soon...</p>
+    `,
+
+    // <p>${teamPitching()} all day, every day</p>
+
 },
 
+
+
+
 ]
 
 

helpers/quilt/wordChecker.js

@@ -0,0 +1,5 @@
+const wordChecker = () => {
+    console.log("loaded word checker");
+    console.log(new Date());
+    return new Date();
+}

quilt.html

@@ -30,7 +30,7 @@
             }
         }
 
-        header {
+        header, article {
             text-align: center;
             margin-bottom: 1rem;
         }
@@ -170,6 +170,7 @@ <h2 class="text-right gutters">Making things work in Madison, Wisconsin: <span c
     <script src="./data/quiltContent.mjs"></script>
     <script src="./data/baseballReferenceArrayPitching.js"></script>
     <script src="./helpers/quilt/teamPitching.mjs"></script>
+    <script src="./helpers/quilt/wordChecker.js"></script>
     <script src="./helpers/quiltMain.js"></script>
     <script src="./helpers/quilt/immediateOutputFromInput.js"></script>
     <script src="./helpers/quilt/maxEnd3.mjs"></script>