Skip to main content Link Menu Expand (external link) Document Search Copy Copied

jQuery Example

<!DOCTYPE html>
<title>JQuery Example</title>
    .hover {
        cursor: pointer;
        text-decoration: underline;
        color: blue;
<script src="" integrity="sha512-+k1pnlgt4F1H8L7t3z95o3/KO+o78INEcXTbnoJQ/F2VqDVhWoaiVml/OEHv9HsVgxUaVW+IbiZPUJQfF/YxZw==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
$(document).ready(function() {
    $("ul li").on("mouseover", function() {
    $("ul li").on("mouseout", function() {

    $("ul li").each(function(index, element) {

        $(this).on("click", function() {

            var numCols = $("#theTable td").length;

            if (numCols == 1) {
                // add another column
                $("#theTable tr").append("<td><ol></ol></td>");



            var oldList = $("ul li").length;
            if (oldList  == 0 ) {
                $("#theTable tr td:eq(0)").remove();


<table id="theTable" class="tableClass">
	<caption>Rank fun things to do in the spring at UVA</caption>
		<li>Walk in the rain</li>
		<li>Playing frisbee on the Lawn</li>
		<li>View a solar eclipse (with appropriate glasses)</li>
		<li>Hiking the Appalachian Trail</li>
		<li>Rock Climbing</li>
		<li>Writing HTML/PHP/JS games in CS 4640</li>
		<li>Playing Tears of the Kingdom on Switch</li>