The provided code has several issues that need to be addressed:
1. **Missing HTML Elements**: The script references elements like
`document.getElementById('strength')` but these elements don't exist in the
HTML.
2. **Element IDs vs Class Names**: In the HTML, the table uses `
` with text
content directly, while the script tries to access elements by IDs that aren't
present.
3. **Spelling Mistakes**: There's a typo in `class_requirements` which should
be `className`.
4. **Scope Issues**: Variables like `classRequirements` are declared inside
functions but used outside their scope.
5. **Rerolling Logic**: The code attempts to handle class ineligibility but
doesn't implement rerolling or adjustments properly.
**Step-by-Step Explanation and Solution:**
1. **Update HTML with Proper IDs**:
Add ID attributes to each ability score row so the script can update them
correctly.
2. **Fix Typographical Errors**:
Correct `class_requirements` to use the correct variable name, such as
`className`.
3. **Move Class Requirements Outside Functions**:
Define `classRequirements` in a place accessible to all functions, perhaps
at the top level.
4. **Implement Rerolling Logic**:
If a character's class isn't eligible based on their scores, generate a new
set of scores until eligibility is met.
5. **Ensure Proper Element Access**:
Make sure that all elements accessed by `getElementById` exist in the HTML
structure.
Here’s the corrected code:
```html
Character Generator
