diff --git a/lets_quiz/templates/base.html b/lets_quiz/templates/base.html
index bbfa09c..a079fe4 100644
--- a/lets_quiz/templates/base.html
+++ b/lets_quiz/templates/base.html
@@ -54,10 +54,9 @@ <h6 class="mt-2"><a href="{% url 'quiz:play' %}" class="text-white">Let's play</
     <script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
     <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.3/umd/popper.min.js" integrity="sha384-vFJXuSJphROIrBnz7yo7oB41mKfc8JzQZiCq4NCceLEaO4IHwicKwpJf9c9IpFgh" crossorigin="anonymous"></script>
     <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta.2/js/bootstrap.min.js" integrity="sha384-alpBpkh1PFOepccYVYDB4do5UnbKysX5WZXm3XxPqe5iKTfUKjNkCk9SaVuEZflJ" crossorigin="anonymous"></script>
-
     <script src="https://cdnjs.cloudflare.com/ajax/libs/smooth-scroll/12.1.5/js/smooth-scroll.min.js" integrity="sha256-MMt0/21G3z0Zg4ET1kI3HC9npItDowkitRDVr0FhCxA=" crossorigin="anonymous"></script>
 
-    <!-- <script src="{% static 'js/main.js' %}"></script>
-    {% block js %}{% endblock js %} -->
+    <!-- <script src="{% static 'js/main.js' %}"></script> -->
+    {% block js %}{% endblock js %}
 </body>
-</html>
\ No newline at end of file
+</html>
diff --git a/lets_quiz/templates/quiz/leaderboard.html b/lets_quiz/templates/quiz/leaderboard.html
index 51bc512..22f22b3 100644
--- a/lets_quiz/templates/quiz/leaderboard.html
+++ b/lets_quiz/templates/quiz/leaderboard.html
@@ -1,9 +1,16 @@
 {% extends 'base.html' %}
 {% block title %} Let's Quiz | Leaderboard {% endblock title %}
+
+{% block css %}
+{#  css for datatables #}
+<link rel="stylesheet" href="https://cdn.datatables.net/1.10.22/css/jquery.dataTables.min.css">
+
+{% endblock %}
+
 {% block content %}
 <div class="container">
     <h1 class="text-center my-4"><span class="badge badge-info"><i class="fa fa-trophy" aria-hidden="true"></i> TOP {{ total_count }} PLAYERS <i class="fa fa-trophy" aria-hidden="true"></i></span></h1>
-    <table class="table table-striped table-bordered">
+    <table class="table table-striped table-bordered" id="leaderboard_table">
         <thead>
             <tr>
                 <th>Position</th>
@@ -22,4 +29,17 @@ <h1 class="text-center my-4"><span class="badge badge-info"><i class="fa fa-trop
         </tbody>
     </table>
 </div>
-{% endblock content %}
\ No newline at end of file
+{% endblock content %}
+
+{% block js %}
+  {# script for datatables #}
+  <script src="https://cdn.datatables.net/1.10.22/js/jquery.dataTables.min.js"></script>
+
+  <script type="text/javascript">
+  // add dataTable to leaderboard table
+    $(document).ready( function () {
+      $('#leaderboard_table').DataTable();
+    });
+
+  </script>
+{% endblock %}