diff --git a/controllers/assignments.py b/controllers/assignments.py
index 4a697ff42..b74602642 100644
--- a/controllers/assignments.py
+++ b/controllers/assignments.py
@@ -550,7 +550,7 @@ def update_submit():
     assignment_id = (
         request.vars.assignment_id
     )  # used to grab the data from jQuery request
-    student_id = request.vars.student_id
+    student_id = auth.user.id
     # pull the grades table for the current student
     grade = (
         db(
@@ -560,17 +560,23 @@ def update_submit():
         .select()
         .first()
     )
+    if request.vars.new_state:
+        is_submit = request.vars.new_state
+    else:
+        is_submit = None
 
     res = {}
 
     if grade:
         # toggles the is_submit variable from True to False
-        if grade.is_submit == "In Progress":
-            is_submit = "Complete"
-        elif grade.is_submit == "Complete":
-            is_submit = "Not Started"
-        else:
-            is_submit = "In Progress"
+        # keep this clause for backward compatibility
+        if is_submit is None:
+            if grade.is_submit == "In Progress":
+                is_submit = "Complete"
+            elif grade.is_submit == "Complete":
+                is_submit = "Not Started"
+            else:
+                is_submit = "In Progress"
 
         db.grades.update_or_insert(
             (db.grades.auth_user == student_id)
@@ -912,7 +918,9 @@ def chooseAssignment():
         timezoneoffset = parsed_js.get("tz_offset", None)
 
     status = []  # This will be used to show the status of each assignment on html file
+    score = []
     duedates = []  # This will be used to display the due date for each assignment
+    ontime = []
 
     course = db(db.courses.id == auth.user.course_id).select().first()
     assignments = db(
@@ -951,10 +959,18 @@ def chooseAssignment():
                     percent_grade = 0.0
                 percent_grade = 100 * grade.score / assignment.points
                 if percent_grade % 10 == 0:
-                    status.append(str(int(percent_grade)) + "%")
+                    score.append(str(int(percent_grade)) + "%")
                 else:
-                    status.append("{0:.1f}%".format(percent_grade))
-            elif grade.is_submit:
+                    score.append("{0:.1f}%".format(percent_grade))
+            else:
+                score.append("Not Graded")
+
+            if deadline <= datetime.datetime.utcnow() and grade.is_submit != "Complete":
+                ontime.append(False)
+            else:
+                ontime.append(True)
+
+            if grade.is_submit:
                 status.append(grade.is_submit)
             elif timestamp > deadline and assignment.enforce_due:
                 status.append("Past Due")
@@ -972,8 +988,10 @@ def chooseAssignment():
         assignments=assignments,
         status=status,
         duedates=duedates,
+        score=score,
         course_id=auth.user.course_name,
         course=course,
+        ontime=ontime,
     )
 
 
diff --git a/static/js/markcomplete.js b/static/js/markcomplete.js
index 2ec1ef63b..bfdaa4a79 100644
--- a/static/js/markcomplete.js
+++ b/static/js/markcomplete.js
@@ -1,14 +1,44 @@
 function markComplete(assignment_id, student_id) {
+    // This function is deprecated as of December 2022
     jQuery.ajax({
         url: eBookConfig.app + '/assignments/update_submit',
         type: "POST",
         dataType: "JSON",
         data: {
             assignment_id: assignment_id,
-            student_id:student_id
+            student_id: student_id
         },
-        success: function (retdata) {
+        success: function(retdata) {
             window.location.reload(true);
         }
     });
-}
\ No newline at end of file
+}
+
+
+
+async function updateAssignmentProgress (newState, assignmentId) {
+
+    let data = {
+        assignment_id: assignmentId,
+        new_state: newState,
+    };
+    let jsheaders = new Headers({
+        "Content-type": "application/json; charset=utf-8",
+        Accept: "application/json",
+    });
+    let request = new Request(`${eBookConfig.app}/assignments/update_submit`, {
+        method: "POST",
+        headers: jsheaders,
+        body: JSON.stringify(data),
+    });
+    let resp = await fetch(request);
+    if (!resp.ok) {
+        alert(`Status Not Updated ${resp.statusText}`);
+    } else {
+        if (location.href.indexOf("doAssignment") > -1) {
+            window.location.reload(true);
+        }
+    }
+
+    console.log(newState);
+}
diff --git a/views/_sphinx_static_files.html b/views/_sphinx_static_files.html
index 9ceae8b48..2c1ea083b 100644
--- a/views/_sphinx_static_files.html
+++ b/views/_sphinx_static_files.html
@@ -63,39 +63,53 @@
 <script src="{{=URL('static', 'js/jquery.datetimepicker.full.min.js')}}"></script>
 <link rel="stylesheet" type="text/css" href="{{=URL('static', 'jquery.datetimepicker.min.css')}}" />
 
-<script type="text/x-mathjax-config">
-    MathJax.Hub.Config({
-        tex2jax: {
-            inlineMath: [['\\(','\\)']]
-        },
-        asciimath2jax: {
-            ignoreClass: ".*",
-            processClass: "has_am"
-        },
-        jax: ["input/AsciiMath"],
-        extensions: ["asciimath2jax.js"],
-        TeX: {
-            extensions: ["extpfeil.js", "autobold.js", "https://pretextbook.org/js/lib/mathjaxknowl.js", "AMScd.js", ],
-            // scrolling to fragment identifiers is controlled by other Javascript
-            positionToHash: false,
-            equationNumbers: { autoNumber: "none", useLabelIds: true, },
-            TagSide: "right",
-            TagIndent: ".8em",
-    Macros: {    },
-        },
-        // HTML-CSS output Jax to be dropped for MathJax 3.0
-        "HTML-CSS": {
-            scale: 88,
-            mtextFontInherit: true,
-        },
-        CommonHTML: {
-            scale: 88,
-            mtextFontInherit: true,
-        },
-    });
+<script>
+var runestoneMathReady = new Promise((resolve) => window.rsMathReady = resolve);
+window.MathJax = {
+  tex: {
+    inlineMath: [['\\(','\\)']],
+    tags: "none",
+    tagSide: "right",
+    tagIndent: ".8em",
+    packages: {'[+]': ['base', 'extpfeil', 'ams', 'amscd', 'newcommand', 'knowl']}
+  },
+  options: {
+    ignoreHtmlClass: "tex2jax_ignore|ignore-math",
+    processHtmlClass: "process-math",
+    renderActions: {
+        findScript: [10, function (doc) {
+            document.querySelectorAll('script[type^="math/tex"]').forEach(function(node) {
+                var display = !!node.type.match(/; *mode=display/);
+                var math = new doc.options.MathItem(node.textContent, doc.inputJax[0], display);
+                var text = document.createTextNode('');
+                node.parentNode.replaceChild(text, node);
+                math.start = {node: text, delim: '', n: 0};
+                math.end = {node: text, delim: '', n: 0};
+                doc.math.push(math);
+            });
+        }, '']
+    },
+  },
+  chtml: {
+    scale: 0.88,
+    mtextInheritFont: true
+  },
+  loader: {
+    load: ['input/asciimath', '[tex]/extpfeil', '[tex]/amscd', '[tex]/newcommand', '[pretext]/mathjaxknowl3.js'],
+    paths: {pretext: "https://pretextbook.org/js/lib"},
+  },
+  startup: {
+    pageReady() {
+      return MathJax.startup.defaultPageReady().then(function () {
+      console.log("in ready function");
+      rsMathReady();
+      }
+    )}
+},
+};
 </script>
 
-<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.5/latest.js?config=TeX-AMS-MML_HTMLorMML"></script>
+<script src="https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-mml-chtml.js"></script>
 
 
 <style>
diff --git a/views/assignments/chooseAssignment.html b/views/assignments/chooseAssignment.html
index 74e2a0ee5..fb35320c7 100644
--- a/views/assignments/chooseAssignment.html
+++ b/views/assignments/chooseAssignment.html
@@ -2,17 +2,37 @@
 
 {{block moreincludes}}
     {{include '_sphinx_static_files.html'}}
+    <script src="/runestone/static/js/markcomplete.js" type="text/javascript"></script>
 {{end}}
 
 <h1>Assignments</h1><h2></h2>
 <table class="table table-striped">
-    <tr><th>Name</th><th>Status</th><th>Due</th><th>Description</th></tr>
+    <tr><th>Name</th><th>My Progress</th><th>Due</th><th>Score<th>Description</th></tr>
     {{i=0}}
     {{for assignment in assignments:}}
         <tr>
             <td><a href="doAssignment?assignment_id={{=assignment['id']}}">{{=assignment['name']}}</a></td>
-            <th>{{=status[i]}}</th>
-            <td>{{=duedates[i]}}</td>
+            <th>
+                <select onchange="updateAssignmentProgress(this.value, {{=assignment['id']}})">
+                {{for option in ["Not Started", "In Progress", "Complete"]:}}
+                    <option
+                    {{ if status[i] == option: }}
+                     selected
+                     {{ pass }}
+                     value="{{=option}}"
+                     >{{=option}}
+                     </option>
+                {{pass}}
+                </select>
+            </th>
+            {{ if ontime[i]:}}
+                <td>{{=duedates[i]}}</td>
+            {{else:}}
+                <td style="color: red">{{=duedates[i]}}</td>
+            {{pass}}
+            <td>
+                {{=score[i]}}
+            </td>
             <td>{{=assignment['description']}}</td>
             {{i+=1}}
         </tr>
diff --git a/views/assignments/doAssignment.html b/views/assignments/doAssignment.html
index ade6a64bb..3ca1bbebf 100644
--- a/views/assignments/doAssignment.html
+++ b/views/assignments/doAssignment.html
@@ -24,15 +24,15 @@ <h2 style='margin-left:1cm;'>Due: {{=assignment['duedate']}}</h2>
     <div>
         {{if is_submit == "Complete" or is_graded or enforce_pastdue:}}
             <div style='background-color:rgb(146, 207, 165); margin-left:2cm; margin-right:2cm;'>
-                <p style='margin-left:0.5cm; margin-right:0.5cm;'>This assignment has been submitted</p>
+                <p style='margin-left:0.5cm; margin-right:0.5cm;'>You have marked this assignment Complete.  Click to mark it <button onclick="updateAssignmentProgress('In Progress', assignmentId)" class="btn btn-info">In Progress</button></p>
             </div>
         {{elif is_submit == "In Progress":}}
             <div style='background-color:rgb(247, 238, 158); margin-left:2cm; margin-right:2cm;'>
-                <p style='margin-left:0.5cm; margin-right:0.5cm;'>This assignment is in progress</p>
+                <p style='margin-left:0.5cm; margin-right:0.5cm;'>You have marked this assignment as In Progress.  Click to mark it as <button onclick="updateAssignmentProgress('Complete', assignmentId)" class="btn btn-info">Complete</button></p>
             </div>
         {{else:}}
             <div style='background-color:rgb(236, 189, 189); margin-left:2cm; margin-right:2cm;'>
-                <p style='margin-left:0.5cm; margin-right:0.5cm;'>This assignment has not been started</p>
+                <p style='margin-left:0.5cm; margin-right:0.5cm;'>You can mark this assignment as <button onclick="updateAssignmentProgress('In Progress', assignmentId)" class="btn btn-info">In Progress</button> by clicking the button.</p>
             </div>
         {{pass}}
     </div>
@@ -125,7 +125,7 @@ <h5 style='text-align:center;'>Not yet graded</h5>
 <div>
     {{if is_submit == "Complete" or is_graded or enforce_pastdue:}}
         <div style='background-color:rgb(146, 207, 165); margin-left:2cm; margin-right:2cm;'>
-            <p style='margin-left:0.5cm; margin-right:0.5cm;'>This assignment has been submitted</p>
+            <p style='margin-left:0.5cm; margin-right:0.5cm;'>You have marked this assignment Complete.  Click to mark it <button onclick="updateAssignmentProgress('In Progress', assignmentId)" class="btn btn-info">In Progress</button></p>
         </div>
         {{if is_graded:}}
             <div style='background-color:powderblue; margin-left:2cm; margin-right:2cm;'>
@@ -141,29 +141,18 @@ <h5 style='text-align:center;'>Not yet graded</h5>
         {{pass}}
     {{elif is_submit == "In Progress":}}
         <div style='background-color:rgb(247, 238, 158); margin-left:2cm; margin-right:2cm;'>
-            <p style='margin-left:0.5cm; margin-right:0.5cm;'>This assignment is in progress</p>
+            <p style='margin-left:0.5cm; margin-right:0.5cm;'>You have marked this assignment as In Progress.  Click to mark it as <button onclick="updateAssignmentProgress('Complete', assignmentId)" class="btn btn-info">Complete</button></p>
         </div>
     {{else:}}
         <div style='background-color:rgb(236, 189, 189); margin-left:2cm; margin-right:2cm;'>
-            <p style='margin-left:0.5cm; margin-right:0.5cm;'>This assignment has not been started</p>
+            <p style='margin-left:0.5cm; margin-right:0.5cm;'>You can mark this assignment as <button onclick="updateAssignmentProgress('In Progress', assignmentId)" class="btn btn-info">In Progress</button> by clicking the button.</p>
         </div>
     {{pass}}
 </div>
 
 {{ if not released and not assignment.is_timed: }}
 <div style="text-align:center">
-    <button class="btn btn-lg buttonAskCompletion" id="gradeMeButton">Score Me</button>
-    {{if not is_graded and not enforce_pastdue:}}
-        <button class="btn btn-lg buttonAskCompletion" id="submitMeButton">
-            {{if is_submit == "Not Started":}}
-                Mark In Progress
-            {{elif is_submit == "In Progress":}}
-                Mark Complete
-            {{else:}}
-                Mark Incomplete
-            {{pass}}
-        </button>
-    {{pass}}
+    <button class="btn btn-lg buttonAskCompletion" id="gradeMeButton">Compute Score for Assignment</button>
     <p><strong>Warning:</strong> Scores for problems that you self grade are unofficial.
         Some problems will need to be manually graded, and your instructor may have requirements that cannot be autograded.
         No deadlines are enforced when self grading, but your instructor may penalize you