Ajeesh KH

像这样更新html、脚本和css

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<script>

        $(document).ready(function(){

            $("button").click(function(){
                var cls = $(this).attr("class");
                $(".course-design-custom").removeClass("active");
                $("#"+cls).addClass("active");
                return false;
            });

        });

</script>

<style>

    .course-design-custom{ display:none; }
    .course-design-custom.active{ display:block; }

</style>

<button id="showMcq" class="McqView">MCQ</button>
<button id="showOe" class="OeView">Open Ended</button>
<button id="showLt" class="LearningTaskView">Learning Task</button>
<button id="showAs" class="AssessmentView">Assessment</button>
<div class="container">
  <div class="row course-design-custom active" id="McqView">
    MCQ
  </div>
  <div class="row course-design-custom d-none" id="OeView">
    Open Ended
  </div>
  <div class="row course-design-custom d-none" id="LearningTaskView">
    Learning Task
  </div>
  <div class="row course-design-custom d-none" id="AssessmentView">
    Assessment
  </div>
</div>