{"id":1709,"date":"2026-07-14T20:24:51","date_gmt":"2026-07-14T20:24:51","guid":{"rendered":"https:\/\/museum.wiserighteous.org\/?page_id=1709"},"modified":"2026-07-14T20:25:33","modified_gmt":"2026-07-14T20:25:33","slug":"quizjean-valjean-les-miserableshugo-2","status":"publish","type":"page","link":"https:\/\/museum.wiserighteous.org\/index.php\/quizjean-valjean-les-miserableshugo-2\/","title":{"rendered":"Quiz:Jean Valjean:\u00a0Les Mis\u00e9rables,Hugo"},"content":{"rendered":"\n<!DOCTYPE html>\n<html lang=\"en\">\n<head>\n    <meta charset=\"UTF-8\">\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0, user-scalable=yes\">\n    <title>Quiz: Jean Valjean \u2014 The Redeemed | Righteous Museum<\/title>\n    <!-- Font Awesome for icons -->\n    <link rel=\"stylesheet\" href=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/font-awesome\/6.0.0-beta3\/css\/all.min.css\">\n    <style>\n        * {\n            margin: 0;\n            padding: 0;\n            box-sizing: border-box;\n        }\n\n        body {\n            background: #1a1a2e;\n            font-family: 'Georgia', 'Times New Roman', Times, serif;\n            color: #2c2b28;\n            line-height: 1.5;\n            padding: 20px;\n        }\n\n        .museum-container {\n            max-width: 1400px;\n            margin: 0 auto;\n            background: #fef7e0;\n            border-radius: 28px;\n            box-shadow: 0 20px 35px rgba(0,0,0,0.3), 0 0 0 1px #c9a87b inset;\n            overflow: hidden;\n        }\n\n        .hero {\n            background: linear-gradient(135deg, #1a1a2a 0%, #0d0d1a 100%);\n            padding: 1.8rem 2.5rem;\n            border-bottom: 6px solid #d4af37;\n            color: #f5e7cf;\n            display: flex;\n            align-items: center;\n            gap: 20px;\n            flex-wrap: wrap;\n        }\n        .hero-text {\n            flex: 2;\n        }\n        .hero h1 {\n            font-size: 2rem;\n            letter-spacing: 1px;\n            font-weight: 600;\n        }\n        .hero h1 i {\n            color: #d4af37;\n            margin-right: 10px;\n        }\n        .hero h1 .app-badge {\n            font-size: 0.8rem;\n            background: #d4af3733;\n            padding: 0.2rem 0.8rem;\n            border-radius: 40px;\n            margin-left: 12px;\n            vertical-align: middle;\n        }\n        .hero p {\n            font-size: 1rem;\n            font-style: italic;\n            margin-top: 0.5rem;\n            opacity: 0.85;\n        }\n        .hero-portrait {\n            flex: 0 0 100px;\n            text-align: center;\n            background: #d4af3730;\n            padding: 8px;\n            border-radius: 50%;\n            border: 2px solid #d4af37;\n        }\n        .hero-portrait i {\n            font-size: 3.5rem;\n            color: #ecd9b4;\n        }\n        .hero-portrait p {\n            font-size: 0.65rem;\n            margin-top: 5px;\n        }\n\n        .flex-main {\n            display: flex;\n            flex-wrap: wrap;\n        }\n        .article-panel {\n            flex: 1.6;\n            min-width: 280px;\n            padding: 2rem 2rem 2rem 2.2rem;\n            background: #fffaf2;\n            border-right: 1px solid #ecd9b4;\n        }\n        .game-sat-panel {\n            flex: 1.2;\n            min-width: 350px;\n            background: #f9efdf;\n            padding: 2rem 1.8rem;\n            display: flex;\n            flex-direction: column;\n            gap: 1.5rem;\n        }\n\n        .article-panel h2 {\n            font-size: 1.8rem;\n            border-left: 7px solid #d4af37;\n            padding-left: 1rem;\n            margin: 0.75rem 0 1rem 0;\n            color: #2d482b;\n        }\n        .article-panel h2 i {\n            color: #d4af37;\n            margin-right: 10px;\n        }\n        .article-panel h3 {\n            font-size: 1.3rem;\n            margin: 1.4rem 0 0.5rem 0;\n            color: #8b5a2b;\n            font-weight: 600;\n        }\n        .article-panel p {\n            margin-bottom: 0.9rem;\n            text-align: justify;\n        }\n        .article-panel blockquote {\n            margin: 1rem 0;\n            padding: 0.8rem 1.5rem;\n            background: #f3eddd;\n            border-left: 5px solid #d4af37;\n            border-radius: 8px;\n            font-style: italic;\n            color: #4a3a2a;\n        }\n        .article-panel blockquote i {\n            color: #d4af37;\n            margin-right: 8px;\n        }\n        .events-grid {\n            display: flex;\n            flex-wrap: wrap;\n            gap: 10px;\n            margin: 15px 0;\n        }\n        .event-badge {\n            background: #e9e0cf;\n            padding: 6px 14px;\n            border-radius: 40px;\n            font-size: 0.8rem;\n            border: 1px solid #cfb37a;\n        }\n        .event-badge i {\n            margin-right: 6px;\n            font-size: 0.7rem;\n        }\n        .reference-list {\n            font-size: 0.8rem;\n            margin-top: 1.5rem;\n            border-top: 1px dashed #cfbc93;\n            padding-top: 1rem;\n            color: #5e4b2b;\n        }\n\n        \/* Mode Selection & Quiz Styles *\/\n        .mode-selector {\n            background: white;\n            border-radius: 28px;\n            padding: 1.2rem;\n            text-align: center;\n            box-shadow: 0 4px 12px rgba(0,0,0,0.1);\n        }\n        .mode-buttons {\n            display: flex;\n            gap: 12px;\n            justify-content: center;\n            margin-top: 12px;\n            flex-wrap: wrap;\n        }\n        .mode-btn {\n            flex: 1;\n            min-width: 90px;\n            padding: 12px;\n            border: none;\n            border-radius: 60px;\n            font-weight: bold;\n            font-size: 1rem;\n            cursor: pointer;\n            transition: 0.2s;\n            font-family: inherit;\n            display: flex;\n            align-items: center;\n            justify-content: center;\n            gap: 8px;\n        }\n        .mode-btn.sat {\n            background: #1e3a2f;\n            color: white;\n        }\n        .mode-btn.psat {\n            background: #2c5f6e;\n            color: white;\n        }\n        .mode-btn.act {\n            background: #8b5a2b;\n            color: white;\n        }\n        .mode-btn:hover {\n            transform: translateY(-2px);\n            filter: brightness(1.05);\n        }\n        .mode-btn.active {\n            box-shadow: 0 0 0 3px #ffd966;\n        }\n        .quiz-header {\n            background: linear-gradient(145deg, #2c4b3e, #1e3a2f);\n            color: white;\n            padding: 1rem;\n            border-radius: 28px;\n            text-align: center;\n        }\n        .score-area {\n            font-size: 1.6rem;\n            font-weight: bold;\n            background: #00000055;\n            display: inline-block;\n            padding: 0.2rem 1.2rem;\n            border-radius: 40px;\n            margin-top: 8px;\n        }\n        .question-card {\n            background: white;\n            border-radius: 28px;\n            padding: 1.5rem;\n            box-shadow: 0 8px 18px rgba(0,0,0,0.1);\n        }\n        .question-text {\n            font-size: 1.1rem;\n            font-weight: 700;\n            margin-bottom: 1.2rem;\n            background: #fdf4e0;\n            padding: 12px;\n            border-radius: 20px;\n            border-left: 5px solid #d4af37;\n        }\n        .options-list {\n            display: flex;\n            flex-direction: column;\n            gap: 10px;\n            margin-bottom: 1.5rem;\n        }\n        .opt-btn {\n            background: #efe2cf;\n            border: 2px solid #cfb37a;\n            padding: 10px 14px;\n            border-radius: 60px;\n            font-family: 'Segoe UI', 'Georgia', serif;\n            font-size: 0.9rem;\n            text-align: left;\n            cursor: pointer;\n            transition: 0.2s;\n        }\n        .opt-btn i {\n            margin-right: 10px;\n        }\n        .opt-btn:hover:not(:disabled) {\n            background: #e2cfb0;\n        }\n        .opt-btn.correct-highlight {\n            background: #a5d6a5;\n            border-color: #2e7d32;\n        }\n        .opt-btn.wrong-highlight {\n            background: #ef9a9a;\n            border-color: #c62828;\n        }\n        .opt-btn:disabled {\n            cursor: default;\n            opacity: 0.8;\n        }\n        .feedback {\n            margin-top: 15px;\n            padding: 12px;\n            border-radius: 20px;\n            background: #f3efdf;\n            font-size: 0.9rem;\n            border-left: 5px solid #d4af37;\n        }\n        .next-btn, .restart-btn {\n            background: #846c3e;\n            border: none;\n            color: white;\n            font-weight: bold;\n            padding: 10px;\n            border-radius: 40px;\n            font-size: 1rem;\n            cursor: pointer;\n            margin-top: 10px;\n            width: 100%;\n        }\n        .next-btn:hover, .restart-btn:hover {\n            background: #5f4a2a;\n        }\n        .game-status {\n            font-size: 0.75rem;\n            text-align: center;\n            background: #e2d5bd;\n            padding: 6px;\n            border-radius: 50px;\n            margin-top: 8px;\n        }\n        footer {\n            text-align: center;\n            padding: 1rem;\n            background: #dfd2b6;\n            font-size: 0.7rem;\n            color: #4a3a22;\n        }\n        .disclaimer {\n            font-size: 0.65rem;\n            text-align: center;\n            margin-top: 8px;\n            color: #6b5a3e;\n        }\n        @media (max-width: 780px) {\n            .hero h1 { font-size: 1.3rem; }\n            .hero-portrait { flex-basis: 70px; }\n            .hero-portrait i { font-size: 2.2rem; }\n        }\n    <\/style>\n<\/head>\n<body>\n<div class=\"museum-container\">\n    <div class=\"hero\">\n        <div class=\"hero-text\">\n            <h1><i class=\"fas fa-dove\"><\/i> Quiz: Jean Valjean \u2014 The Redeemed <span class=\"app-badge\"><i class=\"fas fa-mobile-alt\"><\/i> Literary Quiz<\/span><\/h1>\n            <p><i class=\"fas fa-book-open\"><\/i> A convict transformed by mercy, he chose sacrifice and love over law and bitterness.<\/p>\n        <\/div>\n        <div class=\"hero-portrait\">\n            <i class=\"fas fa-candle\"><\/i>\n            <p><i class=\"fas fa-heart\"><\/i> Mercy<\/p>\n        <\/div>\n    <\/div>\n\n    <div class=\"flex-main\">\n        <div class=\"article-panel\">\n            <h2><i class=\"fas fa-candle\"><\/i> The Redeemed<\/h2>\n            <p>Jean Valjean is the protagonist of Victor Hugo&#8217;s epic novel <em>Les Mis\u00e9rables<\/em>, first published in 1862. The novel is considered one of the greatest works of the 19th century, examining the nature of law and grace, justice, religion, and moral philosophy.<\/p>\n            <p>Valjean begins his journey as a poor peasant who steals a loaf of bread to feed his sister&#8217;s starving children. He is sentenced to five years in the galleys, but multiple escape attempts extend his imprisonment to <strong>nineteen years<\/strong>. Upon release, he is hardened, bitter, and filled with hatred toward a society that has condemned him for a single desperate act. Valjean encounters Bishop Myriel, who shows him unexpected mercy, and this moment transforms him forever. Valjean breaks his parole, changes his identity, becomes a wealthy factory owner and mayor, adopts an orphaned girl named Cosette, and spends the rest of his life trying to do good\u2014all while being relentlessly pursued by Inspector Javert, a lawman who cannot accept that a convict can change.<\/p>\n\n            <div class=\"events-grid\">\n                <span class=\"event-badge\"><i class=\"fas fa-dove\"><\/i> Mercy<\/span>\n                <span class=\"event-badge\"><i class=\"fas fa-shield\"><\/i> Justice<\/span>\n                <span class=\"event-badge\"><i class=\"fas fa-heart\"><\/i> Sacrifice<\/span>\n                <span class=\"event-badge\"><i class=\"fas fa-book\"><\/i> Epic Novel<\/span>\n                <span class=\"event-badge\"><i class=\"fas fa-star\"><\/i> Redemption<\/span>\n            <\/div>\n\n            <h3><i class=\"fas fa-question-circle\"><\/i> The Righteous Dilemma<\/h3>\n            <p>Jean Valjean&#8217;s story forces us to confront one of the most profound questions of righteousness: <strong>When the law condemns the innocent and the desperate, is it righteous to break the law in the name of mercy?<\/strong><\/p>\n            <p>The novel presents two opposing forces: Valjean represents <strong>mercy, grace, and redemption<\/strong>\u2014the belief that people can change, that compassion is higher than punishment. Javert represents <strong>law, judgment, and rigid justice<\/strong>\u2014the belief that the law is absolute and that a convict can never change. The critical difference between the two characters is that Valjean is willing to live out a life of mercy\u2014he is willing to both give and receive it. Javert, by contrast, bases his entire sense of identity and purpose on his own righteousness, and he literally cannot face a world where that righteousness is challenged. When Valjean spares Javert&#8217;s life, Javert finds he cannot live in the contradiction between the judgment he has bestowed upon Valjean and the mercy that Valjean has shown him. He chooses death.<\/p>\n\n            <blockquote><i class=\"fas fa-quote-left\"><\/i> &#8220;Jean Valjean, my brother, you no longer belong to evil. With this silver, I have bought your soul. I&#8217;ve ransomed you from fear and hatred, and now I give you back to God.&#8221; \u2014 Bishop Myriel<\/blockquote>\n\n            <h3><i class=\"fas fa-gem\"><\/i> Key Lessons on Righteousness<\/h3>\n            <ul style=\"padding-left: 1.5rem; margin-bottom: 1rem;\">\n                <li><strong>Mercy is higher than law<\/strong> \u2014 Justice without mercy is not justice\u2014it is cruelty.<\/li>\n                <li><strong>People can change<\/strong> \u2014 No one is defined by their past mistakes. Redemption is always possible.<\/li>\n                <li><strong>Righteousness requires sacrifice<\/strong> \u2014 True righteousness is not comfortable.<\/li>\n                <li><strong>Society creates criminals<\/strong> \u2014 A righteous society addresses the root causes of crime.<\/li>\n                <li><strong>Love is the highest righteousness<\/strong> \u2014 The capacity to love is the measure of a righteous life.<\/li>\n            <\/ul>\n\n            <div class=\"reference-list\">\n                <i class=\"fas fa-book-open\"><\/i> <strong>References:<\/strong> Hugo, V. (1862). <em>Les Mis\u00e9rables<\/em>. A. Lacroix, Verboeckhoven &#038; Cie. Public domain.\n            <\/div>\n        <\/div>\n\n        <div class=\"game-sat-panel\">\n            <div class=\"mode-selector\">\n                <i class=\"fas fa-graduation-cap\"><\/i> <strong>Choose Your Quiz Mode<\/strong>\n                <div class=\"mode-buttons\">\n                    <button id=\"modeSAT\" class=\"mode-btn sat\"><i class=\"fas fa-brain\"><\/i> SAT<\/button>\n                    <button id=\"modePSAT\" class=\"mode-btn psat\"><i class=\"fas fa-pen-fancy\"><\/i> PSAT<\/button>\n                    <button id=\"modeACT\" class=\"mode-btn act\"><i class=\"fas fa-bolt\"><\/i> ACT<\/button>\n                <\/div>\n            <\/div>\n            <div class=\"quiz-header\">\n                <h3 id=\"modeTitle\"><i class=\"fas fa-brain\"><\/i> SAT \u2726 Jean Valjean \u2014 Righteousness Quiz<\/h3>\n                <div class=\"score-area\"><i class=\"fas fa-star\"><\/i> Score: <span id=\"scoreValue\">0<\/span> \/ 600<\/div>\n            <\/div>\n            <div class=\"question-card\" id=\"quizContainer\">\n                <div id=\"dynamicQuestionArea\"><\/div>\n                <div id=\"feedbackArea\" class=\"feedback\"><i class=\"fas fa-info-circle\"><\/i> Select a mode above to begin.<\/div>\n                <button id=\"nextButton\" class=\"next-btn\" style=\"display: none;\"><i class=\"fas fa-arrow-right\"><\/i> Next Question<\/button>\n                <button id=\"restartButton\" class=\"restart-btn\"><i class=\"fas fa-undo-alt\"><\/i> Restart Quiz<\/button>\n                <div class=\"game-status\"><i class=\"fas fa-hourglass-half\"><\/i> 6 questions per mode \u2022 Jean Valjean &#038; righteousness<\/div>\n            <\/div>\n        <\/div>\n    <\/div>\n    <footer>\n        <i class=\"fas fa-chess-queen\"><\/i> The Righteous Museum \u2014 Literary Figures of Righteousness Hall\n        <div class=\"disclaimer\">\n            <i class=\"fas fa-balance-scale\"><\/i> This educational tool is not affiliated with or endorsed by any rights holders. All content is for educational and research purposes under fair use. <em>Les Mis\u00e9rables<\/em> is in the public domain.\n        <\/div>\n    <\/footer>\n<\/div>\n\n<script>\n    \/\/ ========== JEAN VALJEAN QUESTION BANKS ==========\n\n    \/\/ SAT Style \u2014 Analytical, cause\/effect, thematic\n    const SAT_QUESTIONS = [\n        { \n            text: \"Jean Valjean's transformation from hardened criminal to compassionate citizen is most significant as a commentary on:\", \n            options: [\"The importance of wealth\", \"The power of mercy and the possibility of redemption\", \"The value of punishment\", \"The role of government\"], \n            correct: 1, \n            explanation: \"Valjean's transformation is triggered by Bishop Myriel's unexpected mercy, demonstrating that compassion can fundamentally change a person.\"\n        },\n        { \n            text: \"Bishop Myriel's decision to tell the police that he gave Valjean the silver candlesticks represents:\", \n            options: [\"A lie to protect his reputation\", \"A deliberate act of mercy designed to transform Valjean\", \"A sign of weakness\", \"An accident\"], \n            correct: 1, \n            explanation: \"Bishop Myriel's act of mercy gives Valjean a second chance, showing that trust and compassion can redeem even a hardened criminal.\"\n        },\n        { \n            text: \"The conflict between Jean Valjean and Inspector Javert represents:\", \n            options: [\"A personal rivalry\", \"The tension between mercy and rigid law\", \"A financial dispute\", \"A political disagreement\"], \n            correct: 1, \n            explanation: \"Valjean embodies grace and redemption; Javert embodies the law's absolute and unforgiving judgment. Their conflict is the novel's central moral tension.\"\n        },\n        { \n            text: \"Valjean's decision to reveal his identity at Champmathieu's trial demonstrates:\", \n            options: [\"His love of fame\", \"His moral integrity and willingness to sacrifice himself for an innocent man\", \"His desire to go back to prison\", \"His hatred of the justice system\"], \n            correct: 1, \n            explanation: \"Valjean sacrifices his position, wealth, and freedom to save an innocent man, showing that true righteousness requires sacrifice.\"\n        },\n        { \n            text: \"Valjean's act of mercy toward Javert results in:\", \n            options: [\"Javert's immediate forgiveness\", \"Javert's suicide\u2014he cannot reconcile mercy with his rigid worldview\", \"Javert's promotion\", \"Javert's arrest\"], \n            correct: 1, \n            explanation: \"Javert is so shaken by Valjean's mercy that he cannot live with the contradiction between his rigid belief in the law and the grace he has just experienced. He commits suicide.\"\n        },\n        { \n            text: \"The novel's central theme regarding righteousness is that:\", \n            options: [\"The law is always right\", \"Mercy and love are higher than law and punishment\", \"Wealth is the only virtue\", \"Revenge is the only path to justice\"], \n            correct: 1, \n            explanation: \"Les Mis\u00e9rables argues that mercy, grace, and love are the highest virtues\u2014higher than rigid law, punishment, or vengeance.\"\n        }\n    ];\n\n    \/\/ PSAT Style \u2014 Main idea, vocabulary, simpler inference\n    const PSAT_QUESTIONS = [\n        { \n            text: \"Jean Valjean was imprisoned for:\", \n            options: [\"Stealing a loaf of bread\", \"Robbery\", \"Violence\", \"Treason\"], \n            correct: 0, \n            explanation: \"Valjean stole a loaf of bread to feed his sister's starving children and was sentenced to five years in the galleys, later extended to nineteen years.\"\n        },\n        { \n            text: \"The term 'redemption' as used in the context of Jean Valjean most nearly means:\", \n            options: [\"The act of being punished\", \"The act of being saved from sin, error, or evil\", \"The act of becoming wealthy\", \"The act of traveling\"], \n            correct: 1, \n            explanation: \"Valjean's redemption is his journey from bitterness and hatred to love, mercy, and sacrifice.\"\n        },\n        { \n            text: \"Bishop Myriel gave Valjean:\", \n            options: [\"Money\", \"The silver candlesticks and his trust\", \"A job\", \"A house\"], \n            correct: 1, \n            explanation: \"The bishop gave Valjean the silver candlesticks and told him he had 'bought his soul' for God, marking the moment of Valjean's transformation.\"\n        },\n        { \n            text: \"Valjean adopted Cosette because:\", \n            options: [\"He wanted a servant\", \"He loved her and wanted to protect and care for her\", \"He was forced to\", \"He wanted a companion\"], \n            correct: 1, \n            explanation: \"Valjean promises the dying Fantine that he will take care of Cosette, and he raises her with love and devotion.\"\n        },\n        { \n            text: \"Valjean's imprisonment was extended from five to nineteen years because:\", \n            options: [\"He committed more crimes\", \"He attempted to escape\", \"He refused to work\", \"He was framed for another crime\"], \n            correct: 1, \n            explanation: \"Valjean's multiple escape attempts extended his sentence to nineteen years.\"\n        },\n        { \n            text: \"The novel Les Mis\u00e9rables is set in:\", \n            options: [\"England\", \"France\", \"Germany\", \"Italy\"], \n            correct: 1, \n            explanation: \"Les Mis\u00e9rables is set in France, spanning the period from 1815 to 1832, including the June Rebellion of 1832.\"\n        }\n    ];\n\n    \/\/ ACT Style \u2014 Detail recall, factual accuracy, chronological\n    const ACT_QUESTIONS = [\n        { \n            text: \"The author of Les Mis\u00e9rables is:\", \n            options: [\"Alexandre Dumas\", \"Victor Hugo\", \"Charles Dickens\", \"Jules Verne\"], \n            correct: 1, \n            explanation: \"Victor Hugo wrote Les Mis\u00e9rables, published in 1862.\"\n        },\n        { \n            text: \"The year of Les Mis\u00e9rables' publication is:\", \n            options: [\"1850\", \"1862\", \"1870\", \"1880\"], \n            correct: 1, \n            explanation: \"Les Mis\u00e9rables was first published in 1862.\"\n        },\n        { \n            text: \"Jean Valjean's prisoner number was:\", \n            options: [\"24601\", \"24602\", \"24603\", \"24604\"], \n            correct: 0, \n            explanation: \"Jean Valjean's prisoner number is famously 24601.\"\n        },\n        { \n            text: \"The name of the orphaned girl Valjean adopts is:\", \n            options: [\"Cosette\", \"Eponine\", \"Fantine\", \"Marius\"], \n            correct: 0, \n            explanation: \"Valjean adopts Cosette, the daughter of Fantine.\"\n        },\n        { \n            text: \"The revolutionary rebellion depicted in the novel's final section is:\", \n            options: [\"The French Revolution\", \"The June Rebellion of 1832\", \"The July Revolution\", \"The Paris Commune\"], \n            correct: 1, \n            explanation: \"The novel culminates with the June Rebellion of 1832, an uprising in Paris.\"\n        },\n        { \n            text: \"The character who relentlessly pursues Valjean is:\", \n            options: [\"Marius\", \"Thenardier\", \"Javert\", \"Gavroche\"], \n            correct: 2, \n            explanation: \"Inspector Javert relentlessly pursues Valjean, believing the law is absolute and that a convict can never change.\"\n        }\n    ];\n\n    let currentMode = \"SAT\";\n    let currentQuestions = [...SAT_QUESTIONS];\n    let currentIndex = 0;\n    let playerScore = 0;\n    let quizAnswered = false;\n    let selectedOptIdx = null;\n    let totalPerMode = 6;\n\n    \/\/ DOM elements\n    const dynamicArea = document.getElementById(\"dynamicQuestionArea\");\n    const feedbackDiv = document.getElementById(\"feedbackArea\");\n    const nextBtn = document.getElementById(\"nextButton\");\n    const restartBtn = document.getElementById(\"restartButton\");\n    const scoreSpan = document.getElementById(\"scoreValue\");\n    const modeTitle = document.getElementById(\"modeTitle\");\n\n    function updateScoreUI() {\n        scoreSpan.innerText = playerScore;\n    }\n\n    function loadMode(mode) {\n        currentMode = mode;\n        if (mode === \"SAT\") currentQuestions = [...SAT_QUESTIONS];\n        else if (mode === \"PSAT\") currentQuestions = [...PSAT_QUESTIONS];\n        else currentQuestions = [...ACT_QUESTIONS];\n        \n        let icon = mode === \"SAT\" ? '<i class=\"fas fa-brain\"><\/i>' : (mode === \"PSAT\" ? '<i class=\"fas fa-pen-fancy\"><\/i>' : '<i class=\"fas fa-bolt\"><\/i>');\n        modeTitle.innerHTML = `${icon} ${mode} \u2726 Jean Valjean \u2014 Righteousness Quiz`;\n        \n        currentIndex = 0;\n        playerScore = 0;\n        quizAnswered = false;\n        selectedOptIdx = null;\n        updateScoreUI();\n        nextBtn.style.display = \"none\";\n        feedbackDiv.innerHTML = `<i class=\"fas fa-check-circle\"><\/i> ${mode} mode activated. Answer 6 questions about Valjean's moral journey.`;\n        renderQuestion();\n        \n        document.querySelectorAll('.mode-btn').forEach(btn => btn.classList.remove('active'));\n        if (mode === \"SAT\") document.getElementById(\"modeSAT\").classList.add('active');\n        if (mode === \"PSAT\") document.getElementById(\"modePSAT\").classList.add('active');\n        if (mode === \"ACT\") document.getElementById(\"modeACT\").classList.add('active');\n    }\n\n    function renderQuestion() {\n        if (currentIndex >= totalPerMode) {\n            dynamicArea.innerHTML = `\n                <div style=\"text-align:center; padding:20px;\">\n                    <i class=\"fas fa-trophy\" style=\"font-size:3rem; color:#d4af37;\"><\/i>\n                    <h3>${currentMode} Complete!<\/h3>\n                    <p>Your score: ${playerScore} \/ ${totalPerMode*100}<\/p>\n                    <p><i class=\"fas fa-medal\"><\/i> ${getFinalMessage()}<\/p>\n                    <i class=\"fas fa-sync-alt\"><\/i> Switch exam mode or press Restart.\n                <\/div>\n            `;\n            nextBtn.style.display = \"none\";\n            quizAnswered = true;\n            return;\n        }\n\n        const q = currentQuestions[currentIndex];\n        let optionsHtml = '';\n        const letters = ['A', 'B', 'C', 'D'];\n        q.options.forEach((opt, idx) => {\n            let disabledAttr = quizAnswered ? 'disabled' : '';\n            let extraClass = '';\n            if (quizAnswered) {\n                if (idx === q.correct) extraClass = 'correct-highlight';\n                else if (idx === selectedOptIdx && idx !== q.correct) extraClass = 'wrong-highlight';\n            }\n            optionsHtml += `\n                <button class=\"opt-btn ${extraClass}\" data-opt-index=\"${idx}\" ${disabledAttr}>\n                    <i class=\"fas ${idx === 0 ? 'fa-circle' : (idx === 1 ? 'fa-dot-circle' : (idx === 2 ? 'fa-record-vinyl' : 'fa-stop'))}\"><\/i>\n                    <strong>${letters[idx]}.<\/strong> ${escapeHtml(opt)}\n                <\/button>\n            `;\n        });\n\n        const progressHtml = `<div class=\"game-status\" style=\"margin-bottom:12px;\"><i class=\"fas fa-question-circle\"><\/i> Question ${currentIndex+1} of ${totalPerMode} (${currentMode})<\/div>`;\n        const questionHtml = `\n            ${progressHtml}\n            <div class=\"question-text\"><i class=\"fas fa-gavel\"><\/i> ${escapeHtml(q.text)}<\/div>\n            <div class=\"options-list\" id=\"optionsList\">${optionsHtml}<\/div>\n        `;\n        dynamicArea.innerHTML = questionHtml;\n\n        if (!quizAnswered) {\n            document.querySelectorAll('.opt-btn').forEach(btn => {\n                btn.addEventListener('click', (e) => {\n                    if (quizAnswered) return;\n                    const chosenIdx = parseInt(btn.getAttribute('data-opt-index'));\n                    handleAnswer(chosenIdx);\n                });\n            });\n        }\n    }\n\n    function handleAnswer(chosenIdx) {\n        if (quizAnswered) return;\n        const q = currentQuestions[currentIndex];\n        const isCorrect = (chosenIdx === q.correct);\n        selectedOptIdx = chosenIdx;\n        if (isCorrect) {\n            playerScore += 100;\n            updateScoreUI();\n            feedbackDiv.innerHTML = `<i class=\"fas fa-check-circle\" style=\"color:#2e7d32;\"><\/i> ${q.explanation} <i class=\"fas fa-award\"><\/i> +100 points`;\n        } else {\n            const correctLetter = String.fromCharCode(65 + q.correct);\n            const correctText = q.options[q.correct];\n            feedbackDiv.innerHTML = `<i class=\"fas fa-times-circle\" style=\"color:#b71c1c;\"><\/i> Incorrect. Correct answer: ${correctLetter}: ${escapeHtml(correctText)}.<br> ${q.explanation}`;\n        }\n        quizAnswered = true;\n        renderQuestion();\n        nextBtn.style.display = \"block\";\n    }\n\n    function nextQuestion() {\n        if (!quizAnswered && currentIndex < totalPerMode) {\n            feedbackDiv.innerHTML = `<i class=\"fas fa-exclamation-triangle\"><\/i> Please answer before continuing.`;\n            return;\n        }\n        if (currentIndex + 1 <= totalPerMode) {\n            currentIndex++;\n            quizAnswered = false;\n            selectedOptIdx = null;\n            nextBtn.style.display = \"none\";\n            if (currentIndex < totalPerMode) {\n                feedbackDiv.innerHTML = `<i class=\"fas fa-lightbulb\"><\/i> Read carefully, then choose the best answer.`;\n                renderQuestion();\n            } else {\n                renderQuestion();\n                nextBtn.style.display = \"none\";\n            }\n        }\n    }\n\n    function restartQuiz() {\n        loadMode(currentMode);\n    }\n\n    function getFinalMessage() {\n        let maxScore = totalPerMode * 100;\n        if (playerScore === maxScore) return ` Perfect ${currentMode} score! You understand Valjean's journey from convict to redeemer.`;\n        if (playerScore >= 400) return ` Strong ${currentMode} readiness! Mercy is higher than law.`;\n        return ` Review Les Mis\u00e9rables and try again. To love another person is to see the face of God.`;\n    }\n\n    function escapeHtml(str) {\n        return str.replace(\/[&<>]\/g, function(m) {\n            if (m === '&') return '&amp;';\n            if (m === '<') return '&lt;';\n            if (m === '>') return '&gt;';\n            return m;\n        });\n    }\n\n    \/\/ Event bindings\n    document.getElementById(\"modeSAT\").addEventListener(\"click\", () => loadMode(\"SAT\"));\n    document.getElementById(\"modePSAT\").addEventListener(\"click\", () => loadMode(\"PSAT\"));\n    document.getElementById(\"modeACT\").addEventListener(\"click\", () => loadMode(\"ACT\"));\n    nextBtn.addEventListener(\"click\", nextQuestion);\n    restartBtn.addEventListener(\"click\", restartQuiz);\n    \n    \/\/ Initialize with SAT\n    loadMode(\"SAT\");\n<\/script>\n<\/body>\n<\/html>\n","protected":false},"excerpt":{"rendered":"<p>Quiz: Jean Valjean \u2014 The Redeemed | Righteous Museum Quiz: Jean Valjean \u2014 The Redeemed Literary Quiz A convict transformed by mercy, he chose sacrifice and love over law and bitterness. Mercy The Redeemed Jean Valjean is the protagonist of Victor Hugo&#8217;s epic novel Les Mis\u00e9rables, first published in 1862. The novel is considered one [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-1709","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/museum.wiserighteous.org\/index.php\/wp-json\/wp\/v2\/pages\/1709","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/museum.wiserighteous.org\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/museum.wiserighteous.org\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/museum.wiserighteous.org\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/museum.wiserighteous.org\/index.php\/wp-json\/wp\/v2\/comments?post=1709"}],"version-history":[{"count":3,"href":"https:\/\/museum.wiserighteous.org\/index.php\/wp-json\/wp\/v2\/pages\/1709\/revisions"}],"predecessor-version":[{"id":1714,"href":"https:\/\/museum.wiserighteous.org\/index.php\/wp-json\/wp\/v2\/pages\/1709\/revisions\/1714"}],"wp:attachment":[{"href":"https:\/\/museum.wiserighteous.org\/index.php\/wp-json\/wp\/v2\/media?parent=1709"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}