尝试动态删除/添加隐藏类以操作DOM

时间：2018-09-23 15:21:26

标签： javascript jquery html css

我要实现的目标：

我正在研究一个项目，该项目是尽可能地克隆电影网站。我有一组按钮，每个按钮都与列表元素相关联。当用户单击按钮之一时，我要从列表元素中删除与单击按钮有关的 css 类，该类已设置为display: none，同时应用与列表元素无关的 CSS 类。

问题：

我不确定我在做什么错。无济于事的是，控制台未显示任何类型的错误消息。发生的是所有列表元素都应用了 css 类，但是我想显示的列表元素没有显示。

请在下面查看我的代码

HTML： 

    <div class="container">

        <section class="showtimes">

            <ul class="screening-days">

        <li class="selectday active" id="clickMon">Monday</li>
        <li class="selectday" id="clickTue">Tuesday</li>
        <li class="selectday" id="clickWed">Wednesday</li>
        <li class="selectday" id="clickThur">Thursday</li>
        <li class="selectday" id="clickFri">Friday</li>
        <li class="selectday" id="clickSat">Saturday</li>
        <li class="selectday" id="clickSun">Sunday</li>
        <li>Coming Soon</li>

            </ul>

            <span class="filter">

                <p>Filter Films</p>

            </span>

        </section>

    </div>

    <div class="movie-showtimes">

            <ul class="movie-timing mon-listings">

                <li class="daytimeshow mondaylisting">MONDAY<br>10:45</li>
                <li class="daytimeshow mondaylisting">MONDAY<br>13:10</li>
                <li class="daytimeshow mondaylisting">MONDAY<br>15:45</li>
                <li class="daytimeshow mondaylisting">MONDAY<br>18:25</li>
                <li class="daytimeshow mondaylisting">MONDAY<br>20:30</li>
                <li class="daytimeshow mondaylisting">MONDAY<br>21:50</li>

                <li class="daytimeshow hideElement tuesdaylisting">TUESDAY<br>13:50</li>
                <li class="daytimeshow hideElement tuesdaylisting">TUESDAY<br>15:10</li>
                <li class="daytimeshow hideElement tuesdaylisting">TUESDAY<br>17:30</li>
                <li class="daytimeshow hideElement tuesdaylisting">TUESDAY<br>20:00</li>
                <li class="daytimeshow hideElement tuesdaylisting">TUESDAY<br>21:30</li>
                <li class="daytimeshow hideElement tuesdaylisting">TUESDAY<br>22:50</li>

                <li class="daytimeshow hideElement wednesdaylisting">WEDNESDAY<br>10:45</li>
                <li class="daytimeshow hideElement wednesdaylisting">WEDNESDAY<br>13:10</li>
                <li class="daytimeshow hideElement wednesdaylisting">WEDNESDAY<br>15:45</li>
                <li class="daytimeshow hideElement wednesdaylisting">WEDNESDAY<br>18:25</li>
                <li class="daytimeshow hideElement wednesdaylisting">WEDNESDAY<br>20:30</li>
                <li class="daytimeshow hideElement wednesdaylisting">WEDNESDAY<br>21:50</li>

                <li class="daytimeshow hideElement thursdaylisting">THURSDAY<br>11:20</li>
                <li class="daytimeshow hideElement thursdaylisting">THURSDAY<br>14:45</li>
                <li class="daytimeshow hideElement thursdaylisting">THURSDAY<br>16:50</li>
                <li class="daytimeshow hideElement thursdaylisting">THURSDAY<br>18:00</li>
                <li class="daytimeshow hideElement thursdaylisting">THURSDAY<br>19:45</li>
                <li class="daytimeshow hideElement thursdaylisting">THURSDAY<br>22:15</li>

                <li class="daytimeshow hideElement fridaylisting">FRIDAY<br>10:45</li>
                <li class="daytimeshow hideElement fridaylisting">FRIDAY<br>13:10</li>
                <li class="daytimeshow hideElement fridaylisting">FRIDAY<br>15:45</li>
                <li class="daytimeshow hideElement fridaylisting">FRIDAY<br>18:25</li>
                <li class="daytimeshow hideElement fridaylisting">FRIDAY<br>20:30</li>
                <li class="daytimeshow hideElement fridaylisting">FRIDAY<br>21:50</li>

                <li class="daytimeshow hideElement saturdaylisting">SATURDAY<br>13:15</li>
                <li class="daytimeshow hideElement saturdaylisting">SATURDAY<br>14:30</li>
                <li class="daytimeshow hideElement saturdaylisting">SATURDAY<br>18:10</li>
                <li class="daytimeshow hideElement saturdaylisting">SATURDAY<br>19:45</li>
                <li class="daytimeshow hideElement saturdaylisting">SATURDAY<br>20:15</li>
                <li class="daytimeshow hideElement saturdaylisting">SATURDAY<br>22:30</li>

                <li class="daytimeshow hideElement sundaylisting">SUNDAY<br>14:45</li>
                <li class="daytimeshow hideElement sundaylisting">SUNDAY<br>16:30</li>
                <li class="daytimeshow hideElement sundaylisting">SUNDAY<br>18:10</li>
                <li class="daytimeshow hideElement sundaylisting">SUNDAY<br>20:35</li>
                <li class="daytimeshow hideElement sundaylisting">SUNDAY<br>21:15</li>
                <li class="daytimeshow hideElement sundaylisting">SUNDAY<br>22:45</li>

        </div>

    </div>

    <div class="classic-movie">

        <div class="movie-summary">

            <div class="movie-image">

                <img src="images/movie-images/back-to-the-future.jpg" class="movie-thumbnail">

            </div>

            <div class="movie-name-plot">

                <h1>Back to the Future (1985)</h1>

                <p>Marty McFly, a typical American teenager of the Eighties, is accidentally sent back to 1955 in a plutonium-powered DeLorean 'time machine' invented by a slightly mad scientist. During his often hysterical, always amazing trip back in time, Marty must make certain his teenage parents-to-be meet and fall in love - so he can get back to the future.</p> 

                <p><span class="white-mini-header">Starring:</span> Michael J. Fox, Christopher Lloyd, Lea Thompson</p>

                <p><span class="white-mini-header">Runtime:</span>116 min</p>

            </div>

        </div>

        <div class="movie-showtimes">

            <ul class="movie-timing mon-listings">

                <li class="daytimeshow mondaylisting">MONDAY<br>11:20</li>
                <li class="daytimeshow mondaylisting">MONDAY<br>14:45</li>
                <li class="daytimeshow mondaylisting">MONDAY<br>16:50</li>
                <li class="daytimeshow mondaylisting">MONDAY<br>18:00</li>
                <li class="daytimeshow mondaylisting">MONDAY<br>19:45</li>
                <li class="daytimeshow mondaylisting">MONDAY<br>22:15</li>

                <li class="daytimeshow hideElement tuesdaylisting">TUESDAY<br>14:45</li>
                <li class="daytimeshow hideElement tuesdaylisting">TUESDAY<br>16:30</li>
                <li class="daytimeshow hideElement tuesdaylisting">TUESDAY<br>18:10</li>
                <li class="daytimeshow hideElement tuesdaylisting">TUESDAY<br>20:35</li>
                <li class="daytimeshow hideElement tuesdaylisting">TUESDAY<br>21:15</li>
                <li class="daytimeshow hideElement tuesdaylisting">TUESDAY<br>22:45</li>

                <li class="daytimeshow hideElement wednesdaylisting">WEDNESDAY<br>10:45</li>
                <li class="daytimeshow hideElement wednesdaylisting">WEDNESDAY<br>13:10</li>
                <li class="daytimeshow hideElement wednesdaylisting">WEDNESDAY<br>15:45</li>
                <li class="daytimeshow hideElement wednesdaylisting">WEDNESDAY<br>18:25</li>
                <li class="daytimeshow hideElement wednesdaylisting">WEDNESDAY<br>20:30</li>
                <li class="daytimeshow hideElement wednesdaylisting">WEDNESDAY<br>21:50</li>

                <li class="daytimeshow hideElement thursdaylisting">THURSDAY<br>11:20</li>
                <li class="daytimeshow hideElement thursdaylisting">THURSDAY<br>14:45</li>
                <li class="daytimeshow hideElement thursdaylisting">THURSDAY<br>16:50</li>
                <li class="daytimeshow hideElement thursdaylisting">THURSDAY<br>18:00</li>
                <li class="daytimeshow hideElement thursdaylisting">THURSDAY<br>19:45</li>
                <li class="daytimeshow hideElement thursdaylisting">THURSDAY<br>22:15</li>

                <li class="daytimeshow hideElement fridaylisting">FRIDAY<br>10:45</li>
                <li class="daytimeshow hideElement fridaylisting">FRIDAY<br>13:10</li>
                <li class="daytimeshow hideElement fridaylisting">FRIDAY<br>15:45</li>
                <li class="daytimeshow hideElement fridaylisting">FRIDAY<br>18:25</li>
                <li class="daytimeshow hideElement fridaylisting">FRIDAY<br>20:30</li>
                <li class="daytimeshow hideElement fridaylisting">FRIDAY<br>21:50</li>

                <li class="daytimeshow hideElement saturdaylisting">SATURDAY<br>13:15</li>
                <li class="daytimeshow hideElement saturdaylisting">SATURDAY<br>14:30</li>
                <li class="daytimeshow hideElement saturdaylisting">SATURDAY<br>18:10</li>
                <li class="daytimeshow hideElement saturdaylisting">SATURDAY<br>19:45</li>
                <li class="daytimeshow hideElement saturdaylisting">SATURDAY<br>20:15</li>
                <li class="daytimeshow hideElement saturdaylisting">SATURDAY<br>22:30</li>

                <li class="daytimeshow hideElement sundaylisting">SUNDAY<br>14:45</li>
                <li class="daytimeshow hideElement sundaylisting">SUNDAY<br>16:30</li>
                <li class="daytimeshow hideElement sundaylisting">SUNDAY<br>18:10</li>
                <li class="daytimeshow hideElement sundaylisting">SUNDAY<br>20:35</li>
                <li class="daytimeshow hideElement sundaylisting">SUNDAY<br>21:15</li>
                <li class="daytimeshow hideElement sundaylisting">SUNDAY<br>22:45</li>

            </ul>

        </div>

    </div>

    <div class="classic-movie">

        <div class="movie-summary">

            <div class="movie-image">

                <img src="images/movie-images/first-blood.jpg" class="movie-thumbnail">

            </div>

            <div class="movie-name-plot">

                <h1>First Blood (1982)</h1>

                <p>John Rambo is a disoriented Vietnam Vet. He is hitchhiking from town to town to see friends from the war. A sheriff tries to make him leave town and when he refuses, arrests him for vagrancy. While in jail, a deputy takes delight in abusing him. Rambo escapes showing his old Vietnam fighting skills and takes to the woods as the sheriff and deputies try and find him in his element. Things get out of hand as Colonel Trautman, Rambo's old commander, appears to shed light on the situation.</p> 

                <p><span class="white-mini-header">Starring:</span>Sylvester Stallone, Brian Dennehy, Richard Crenna</p>

                <p><span class="white-mini-header">Runtime:</span>93 min</p>

            </div>

        </div>

        <div class="movie-showtimes">

            <ul class="movie-timing mon-listings">

                <li class="daytimeshow mondaylisting">MONDAY<br>10:45</li>
                <li class="daytimeshow mondaylisting">MONDAY<br>13:30</li>
                <li class="daytimeshow mondaylisting">MONDAY<br>17:00</li>
                <li class="daytimeshow mondaylisting">MONDAY<br>18:45</li>
                <li class="daytimeshow mondaylisting">MONDAY<br>20:15</li>
                <li class="daytimeshow mondaylisting">MONDAY<br>22:00</li>

                <li class="daytimeshow hideElement tuesdaylisting">TUESDAY<br>13:50</li>
                <li class="daytimeshow hideElement tuesdaylisting">TUESDAY<br>15:10</li>
                <li class="daytimeshow hideElement tuesdaylisting">TUESDAY<br>17:30</li>
                <li class="daytimeshow hideElement tuesdaylisting">TUESDAY<br>20:00</li>
                <li class="daytimeshow hideElement tuesdaylisting">TUESDAY<br>21:30</li>
                <li class="daytimeshow hideElement tuesdaylisting">TUESDAY<br>22:50</li>

                <li class="daytimeshow hideElement wednesdaylisting">WEDNESDAY<br>14:45</li>
                <li class="daytimeshow hideElement wednesdaylisting">WEDNESDAY<br>16:30</li>
                <li class="daytimeshow hideElement wednesdaylisting">WEDNESDAY<br>18:10</li>
                <li class="daytimeshow hideElement wednesdaylisting">WEDNESDAY<br>20:35</li>
                <li class="daytimeshow hideElement wednesdaylisting">WEDNESDAY<br>21:15</li>
                <li class="daytimeshow hideElement wednesdaylisting">WEDNESDAY<br>22:45</li>

                <li class="daytimeshow hideElement thursdaylisting">THURSDAY<br>11:20</li>
                <li class="daytimeshow hideElement thursdaylisting">THURSDAY<br>14:45</li>
                <li class="daytimeshow hideElement thursdaylisting">THURSDAY<br>16:50</li>
                <li class="daytimeshow hideElement thursdaylisting">THURSDAY<br>18:00</li>
                <li class="daytimeshow hideElement thursdaylisting">THURSDAY<br>19:45</li>
                <li class="daytimeshow hideElement thursdaylisting">THURSDAY<br>22:15</li>

                <li class="daytimeshow hideElement fridaylisting">FRIDAY<br>10:45</li>
                <li class="daytimeshow hideElement fridaylisting">FRIDAY<br>13:10</li>
                <li class="daytimeshow hideElement fridaylisting">FRIDAY<br>15:45</li>
                <li class="daytimeshow hideElement fridaylisting">FRIDAY<br>18:25</li>
                <li class="daytimeshow hideElement fridaylisting">FRIDAY<br>20:30</li>
                <li class="daytimeshow hideElement fridaylisting">FRIDAY<br>21:50</li>

                <li class="daytimeshow hideElement saturdaylisting">SATURDAY<br>13:15</li>
                <li class="daytimeshow hideElement saturdaylisting">SATURDAY<br>14:30</li>
                <li class="daytimeshow hideElement saturdaylisting">SATURDAY<br>18:10</li>
                <li class="daytimeshow hideElement saturdaylisting">SATURDAY<br>19:45</li>
                <li class="daytimeshow hideElement saturdaylisting">SATURDAY<br>20:15</li>
                <li class="daytimeshow hideElement saturdaylisting">SATURDAY<br>22:30</li>

                <li class="daytimeshow hideElement sundaylisting">SUNDAY<br>14:45</li>
                <li class="daytimeshow hideElement sundaylisting">SUNDAY<br>16:30</li>
                <li class="daytimeshow hideElement sundaylisting">SUNDAY<br>18:10</li>
                <li class="daytimeshow hideElement sundaylisting">SUNDAY<br>20:35</li>
                <li class="daytimeshow hideElement sundaylisting">SUNDAY<br>21:15</li>
                <li class="daytimeshow hideElement sundaylisting">SUNDAY<br>22:45</li>

            </ul>


        </div>

    </div>

    <div class="classic-movie">

        <div class="movie-summary">

            <div class="movie-image">

                <img src="images/movie-images/breakfast-club.jpg" class="movie-thumbnail">

            </div>

            <div class="movie-name-plot">

                <h1>The Breakfast Club (1985)</h1>

                <p>They were five students with nothing in common, faced with spending a Saturday detention together in their high school library. At 7 a.m., they had nothing to say, but by 4 p.m., they had bared their souls to each other and become good friends. To the outside world they were simply a Brain, an Athlete, a Basket Case, a Princess, and a Criminal, but to each other, they would always be the Breakfast Club.</p> 

                <p><span class="white-mini-header">Starring:</span>Emilio Estevez, Judd Nelson, Molly Ringwald</p>

                <p><span class="white-mini-header">Runtime:</span>97 min</p>

            </div>

        </div>

        <div class="movie-showtimes">

            <ul class="movie-timing mon-listings">

                <li class="daytimeshow mondaylisting">MONDAY<br>13:15</li>
                <li class="daytimeshow mondaylisting">MONDAY<br>14:30</li>
                <li class="daytimeshow mondaylisting">MONDAY<br>18:10</li>
                <li class="daytimeshow mondaylisting">MONDAY<br>19:45</li>
                <li class="daytimeshow mondaylisting">MONDAY<br>20:15</li>
                <li class="daytimeshow mondaylisting">MONDAY<br>22:30</li>

                <li class="daytimeshow hideElement tuesdaylisting">TUESDAY<br>13:50</li>
                <li class="daytimeshow hideElement tuesdaylisting">TUESDAY<br>15:10</li>
                <li class="daytimeshow hideElement tuesdaylisting">TUESDAY<br>17:30</li>
                <li class="daytimeshow hideElement tuesdaylisting">TUESDAY<br>20:00</li>
                <li class="daytimeshow hideElement tuesdaylisting">TUESDAY<br>21:30</li>
                <li class="daytimeshow hideElement tuesdaylisting">TUESDAY<br>22:50</li>

                <li class="daytimeshow hideElement wednesdaylisting">WEDNESDAY<br>10:45</li>
                <li class="daytimeshow hideElement wednesdaylisting">WEDNESDAY<br>13:10</li>
                <li class="daytimeshow hideElement wednesdaylisting">WEDNESDAY<br>15:45</li>
                <li class="daytimeshow hideElement wednesdaylisting">WEDNESDAY<br>18:25</li>
                <li class="daytimeshow hideElement wednesdaylisting">WEDNESDAY<br>20:30</li>
                <li class="daytimeshow hideElement wednesdaylisting">WEDNESDAY<br>21:50</li>

                <li class="daytimeshow hideElement thursdaylisting">THURSDAY<br>11:20</li>
                <li class="daytimeshow hideElement thursdaylisting">THURSDAY<br>14:45</li>
                <li class="daytimeshow hideElement thursdaylisting">THURSDAY<br>16:50</li>
                <li class="daytimeshow hideElement thursdaylisting">THURSDAY<br>18:00</li>
                <li class="daytimeshow hideElement thursdaylisting">THURSDAY<br>19:45</li>
                <li class="daytimeshow hideElement thursdaylisting">THURSDAY<br>22:15</li>

                <li class="daytimeshow hideElement fridaylisting">FRIDAY<br>10:45</li>
                <li class="daytimeshow hideElement fridaylisting">FRIDAY<br>13:10</li>
                <li class="daytimeshow hideElement fridaylisting">FRIDAY<br>15:45</li>
                <li class="daytimeshow hideElement fridaylisting">FRIDAY<br>18:25</li>
                <li class="daytimeshow hideElement fridaylisting">FRIDAY<br>20:30</li>
                <li class="daytimeshow hideElement fridaylisting">FRIDAY<br>21:50</li>

                <li class="daytimeshow hideElement saturdaylisting">SATURDAY<br>13:15</li>
                <li class="daytimeshow hideElement saturdaylisting">SATURDAY<br>14:30</li>
                <li class="daytimeshow hideElement saturdaylisting">SATURDAY<br>18:10</li>
                <li class="daytimeshow hideElement saturdaylisting">SATURDAY<br>19:45</li>
                <li class="daytimeshow hideElement saturdaylisting">SATURDAY<br>20:15</li>
                <li class="daytimeshow hideElement saturdaylisting">SATURDAY<br>22:30</li>

                <li class="daytimeshow hideElement sundaylisting">SUNDAY<br>14:45</li>
                <li class="daytimeshow hideElement sundaylisting">SUNDAY<br>16:30</li>
                <li class="daytimeshow hideElement sundaylisting">SUNDAY<br>18:10</li>
                <li class="daytimeshow hideElement sundaylisting">SUNDAY<br>20:35</li>
                <li class="daytimeshow hideElement sundaylisting">SUNDAY<br>21:15</li>
                <li class="daytimeshow hideElement sundaylisting">SUNDAY<br>22:45</li>

            </ul>


        </div>

    </div>

    <div class="classic-movie">

        <div class="movie-summary">

            <div class="movie-image">

                <img src="images/movie-images/halloween.jpg" class="movie-thumbnail">

            </div>

            <div class="movie-name-plot">

                <h1>Halloween (1979)</h1>

                <p>The year is 1963, the night: Halloween. Police are called to 43 Lampkin Ln. only to discover that 15 year old Judith Myers has been stabbed to death, by her 6 year-old brother, Michael. After being institutionalized for 15 years, Myers breaks out on the night before Halloween. No one knows, nor wants to find out, what will happen on October 31st 1978 besides Myers' psychiatrist, Dr. Loomis. He knows Michael is coming back to Haddonfield, but by the time the town realizes it, it'll be too late for many people.</p> 

                <p><span class="white-mini-header">Starring:</span>Donald Pleasence, Jamie Lee Curtis, Tony Moran</p>

                <p><span class="white-mini-header">Runtime:</span>91 min</p>

            </div>

        </div>

        <div class="movie-showtimes">

            <ul class="movie-timing mon-listings">

                <li class="daytimeshow mondaylisting">MONDAY<br>14:45</li>
                <li class="daytimeshow mondaylisting">MONDAY<br>16:30</li>
                <li class="daytimeshow mondaylisting">MONDAY<br>18:10</li>
                <li class="daytimeshow mondaylisting">MONDAY<br>20:35</li>
                <li class="daytimeshow mondaylisting">MONDAY<br>21:15</li>
                <li class="daytimeshow mondaylisting">MONDAY<br>22:45</li>

                <li class="daytimeshow hideElement tuesdaylisting">TUESDAY<br>13:30</li>
                <li class="daytimeshow hideElement tuesdaylisting">TUESDAY<br>15:00</li>
                <li class="daytimeshow hideElement tuesdaylisting">TUESDAY<br>18:00</li>
                <li class="daytimeshow hideElement tuesdaylisting">TUESDAY<br>18:15</li>
                <li class="daytimeshow hideElement tuesdaylisting">TUESDAY<br>21:30</li>
                <li class="daytimeshow hideElement tuesdaylisting">TUESDAY<br>22:15</li>

                <li class="daytimeshow hideElement wednesdaylisting">WEDNESDAY<br>16:30</li>
                <li class="daytimeshow hideElement wednesdaylisting">WEDNESDAY<br>17:00</li>
                <li class="daytimeshow hideElement wednesdaylisting">WEDNESDAY<br>19:45</li>
                <li class="daytimeshow hideElement wednesdaylisting">WEDNESDAY<br>20:00</li>
                <li class="daytimeshow hideElement wednesdaylisting">WEDNESDAY<br>21:45</li>
                <li class="daytimeshow hideElement wednesdaylisting">WEDNESDAY<br>22:30</li>

                <li class="daytimeshow hideElement thursdaylisting">THURSDAY<br>12:30</li>
                <li class="daytimeshow hideElement thursdaylisting">THURSDAY<br>13:30</li>
                <li class="daytimeshow hideElement thursdaylisting">THURSDAY<br>15:15</li>
                <li class="daytimeshow hideElement thursdaylisting">THURSDAY<br>16:15</li>
                <li class="daytimeshow hideElement thursdaylisting">THURSDAY<br>19:00</li>
                <li class="daytimeshow hideElement thursdaylisting">THURSDAY<br>22:30</li>

                <li class="daytimeshow hideElement fridaylisting">FRIDAY<br>16:30</li>
                <li class="daytimeshow hideElement fridaylisting">FRIDAY<br>17:00</li>
                <li class="daytimeshow hideElement fridaylisting">FRIDAY<br>19:45</li>
                <li class="daytimeshow hideElement fridaylisting">FRIDAY<br>20:00</li>
                <li class="daytimeshow hideElement fridaylisting">FRIDAY<br>21:45</li>
                <li class="daytimeshow hideElement fridaylisting">FRIDAY<br>22:30</li>

                <li class="daytimeshow hideElement saturdaylisting">SATURDAY<br>14:45</li>
                <li class="daytimeshow hideElement saturdaylisting">SATURDAY<br>16:30</li>
                <li class="daytimeshow hideElement saturdaylisting">SATURDAY<br>18:10</li>
                <li class="daytimeshow hideElement saturdaylisting">SATURDAY<br>20:35</li>
                <li class="daytimeshow hideElement saturdaylisting">SATURDAY<br>21:15</li>
                <li class="daytimeshow hideElement saturdaylisting">SATURDAY<br>22:45</li>

                <li class="daytimeshow hideElement sundaylisting">SUNDAY<br>12:30</li>
                <li class="daytimeshow hideElement sundaylisting">SUNDAY<br>13:30</li>
                <li class="daytimeshow hideElement sundaylisting">SUNDAY<br>15:15</li>
                <li class="daytimeshow hideElement sundaylisting">SUNDAY<br>16:15</li>
                <li class="daytimeshow hideElement sundaylisting">SUNDAY<br>19:00</li>
                <li class="daytimeshow hideElement sundaylisting">SUNDAY<br>22:30</li>

            </ul>


        </div>

    </div>

    <div class="classic-movie">

        <div class="movie-summary">

            <div class="movie-image">

                <img src="images/movie-images/goodfellas.jpg" class="movie-thumbnail">

            </div>

            <div class="movie-name-plot">

                <h1>Goodfellas (1990)</h1>

                <p>Henry Hill might be a small time gangster, who may have taken part in a robbery with Jimmy Conway and Tommy De Vito, two other gangsters who might have set their sights a bit higher. His two partners could kill off everyone else involved in the robbery, and slowly start to think about climbing up through the hierarchy of the Mob. Henry, however, might be badly affected by his partners' success, but will he consider stooping low enough to bring about the downfall of Jimmy and Tommy?</p> 

                <p><span class="white-mini-header">Starring:</span>Robert De Niro, Ray Liotta, Joe Pesci</p>

                <p><span class="white-mini-header">Runtime:</span>146 min</p>

            </div>

        </div>

        <div class="movie-showtimes">

            <ul class="movie-timing mon-listings show">

                <li class="daytimeshow mondaylisting">MONDAY<br>12:25</li>
                <li class="daytimeshow mondaylisting">MONDAY<br>13:30</li>
                <li class="daytimeshow mondaylisting">MONDAY<br>14:50</li>
                <li class="daytimeshow mondaylisting">MONDAY<br>17:35</li>
                <li class="daytimeshow mondaylisting">MONDAY<br>20:15</li>
                <li class="daytimeshow mondaylisting">MONDAY<br>22:30</li>

                <li class="daytimeshow hideElement tuesdaylisting">TUESDAY<br>13:50</li>
                <li class="daytimeshow hideElement tuesdaylisting">TUESDAY<br>15:10</li>
                <li class="daytimeshow hideElement tuesdaylisting">TUESDAY<br>17:30</li>
                <li class="daytimeshow hideElement tuesdaylisting">TUESDAY<br>20:00</li>
                <li class="daytimeshow hideElement tuesdaylisting">TUESDAY<br>21:30</li>
                <li class="daytimeshow hideElement tuesdaylisting">TUESDAY<br>22:50</li>

                <li class="daytimeshow hideElement wednesdaylisting">WEDNESDAY<br>10:45</li>
                <li class="daytimeshow hideElement wednesdaylisting">WEDNESDAY<br>13:10</li>
                <li class="daytimeshow hideElement wednesdaylisting">WEDNESDAY<br>15:45</li>
                <li class="daytimeshow hideElement wednesdaylisting">WEDNESDAY<br>18:25</li>
                <li class="daytimeshow hideElement wednesdaylisting">WEDNESDAY<br>20:30</li>
                <li class="daytimeshow hideElement wednesdaylisting">WEDNESDAY<br>21:50</li>

                <li class="daytimeshow hideElement thursdaylisting">THURSDAY<br>11:20</li>
                <li class="daytimeshow hideElement thursdaylisting">THURSDAY<br>14:45</li>
                <li class="daytimeshow hideElement thursdaylisting">THURSDAY<br>16:50</li>
                <li class="daytimeshow hideElement thursdaylisting">THURSDAY<br>18:00</li>
                <li class="daytimeshow hideElement thursdaylisting">THURSDAY<br>19:45</li>
                <li class="daytimeshow hideElement thursdaylisting">THURSDAY<br>22:15</li>

                <li class="daytimeshow hideElement fridaylisting">FRIDAY<br>10:45</li>
                <li class="daytimeshow hideElement fridaylisting">FRIDAY<br>13:10</li>
                <li class="daytimeshow hideElement fridaylisting">FRIDAY<br>15:45</li>
                <li class="daytimeshow hideElement fridaylisting">FRIDAY<br>18:25</li>
                <li class="daytimeshow hideElement fridaylisting">FRIDAY<br>20:30</li>
                <li class="daytimeshow hideElement fridaylisting">FRIDAY<br>21:50</li>

                <li class="daytimeshow hideElement saturdaylisting">SATURDAY<br>13:15</li>
                <li class="daytimeshow hideElement saturdaylisting">SATURDAY<br>14:30</li>
                <li class="daytimeshow hideElement saturdaylisting">SATURDAY<br>18:10</li>
                <li class="daytimeshow hideElement saturdaylisting">SATURDAY<br>19:45</li>
                <li class="daytimeshow hideElement saturdaylisting">SATURDAY<br>20:15</li>
                <li class="daytimeshow hideElement saturdaylisting">SATURDAY<br>22:30</li>

                <li class="daytimeshow hideElement sundaylisting">SUNDAY<br>14:45</li>
                <li class="daytimeshow hideElement sundaylisting">SUNDAY<br>16:30</li>
                <li class="daytimeshow hideElement sundaylisting">SUNDAY<br>18:10</li>
                <li class="daytimeshow hideElement sundaylisting">SUNDAY<br>20:35</li>
                <li class="daytimeshow hideElement sundaylisting">SUNDAY<br>21:15</li>
                <li class="daytimeshow hideElement sundaylisting">SUNDAY<br>22:45</li>

            </ul>


        </div>

    </div>

</div>

JavaScript： 

$(document).ready(function() {

    var daytimeshow = document.querySelectorAll(".selectday");
    var showtimeListings = document.querySelectorAll(".daytimeshow");
    var mondayShowings = document.querySelectorAll(".mondaylisting");
    var tuesdayShowings = document.querySelectorAll(".tuesdaylisting");
    var wednesdayShowings = document.querySelectorAll(".wednesdaylisting");
    var thursdayShowings = document.querySelectorAll(".thursdaylisting");
    var fridayShowings = document.querySelectorAll(".fridaylisting");
    var saturdayShowings = document.querySelectorAll(".saturdaylisting");

        for (var i = 0; i < daytimeshow.length; i++){
        daytimeshow[i].addEventListener("click", function(){
            if (this.id === "clickTue"){
                for (var i = 0; i < showtimeListings.length; i++){
                    if (showtimeListings[i].classList === "tuesdaylisting"){
                        showtimeListings[i].classList.remove("hideElement");
                    } else {
                        showtimeListings[i].classList.add("hideElement");
                    }
                }
            }
        })
    }



});

2 个答案:

答案 0 :(得分：1)

由于每个元素上都有多个类名，因此应使用contains()而不是===来比较类名：

if (showtimeListings[i].classList.contains("tuesdaylisting"))

答案 1 :(得分：1)

我已纠正您的逻辑。看看下面的代码片段。整理了显示星期二列表的逻辑。删除了this.id，并在嵌套的for循环中重新声明了i var。用于包含，添加，从classList中删除。

点击星期二查看它的运行情况。

$(document).ready(function() {

  var daytimeshow = document.querySelectorAll(".selectday");
  var showtimeListings = document.querySelectorAll(".daytimeshow");
  var mondayShowings = document.querySelectorAll(".mondaylisting");
  var tuesdayShowings = document.querySelectorAll(".tuesdaylisting");
  var wednesdayShowings = document.querySelectorAll(".wednesdaylisting");
  var thursdayShowings = document.querySelectorAll(".thursdaylisting");
  var fridayShowings = document.querySelectorAll(".fridaylisting");
  var saturdayShowings = document.querySelectorAll(".saturdaylisting");
  for (var i = 0; i < daytimeshow.length; i++) {
    daytimeshow[i].addEventListener("click", (e) => {
      if (e.target.id === "clickTue") {
        for (var j = 0; j < showtimeListings.length; j++) {
          var classList = showtimeListings[j].classList;
          classList.contains("tuesdaylisting") ? classList.remove("hideElement") : classList.add("hideElement");
        }
      }
    })
  }



});
.hideElement {
  display: none;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="container">

  <section class="showtimes">

    <ul class="screening-days">

      <li class="selectday active" id="clickMon">Monday</li>
      <li class="selectday" id="clickTue">Tuesday</li>
      <li class="selectday" id="clickWed">Wednesday</li>
      <li class="selectday" id="clickThur">Thursday</li>
      <li class="selectday" id="clickFri">Friday</li>
      <li class="selectday" id="clickSat">Saturday</li>
      <li class="selectday" id="clickSun">Sunday</li>
      <li>Coming Soon</li>

    </ul>

    <span class="filter">

                <p>Filter Films</p>

            </span>

  </section>

</div>

<div class="movie-showtimes">

  <ul class="movie-timing mon-listings">

    <li class="daytimeshow mondaylisting">MONDAY<br>10:45</li>
    <li class="daytimeshow mondaylisting">MONDAY<br>13:10</li>
    <li class="daytimeshow mondaylisting">MONDAY<br>15:45</li>
    <li class="daytimeshow mondaylisting">MONDAY<br>18:25</li>
    <li class="daytimeshow mondaylisting">MONDAY<br>20:30</li>
    <li class="daytimeshow mondaylisting">MONDAY<br>21:50</li>

    <li class="daytimeshow hideElement tuesdaylisting">TUESDAY<br>13:50</li>
    <li class="daytimeshow hideElement tuesdaylisting">TUESDAY<br>15:10</li>
    <li class="daytimeshow hideElement tuesdaylisting">TUESDAY<br>17:30</li>
    <li class="daytimeshow hideElement tuesdaylisting">TUESDAY<br>20:00</li>
    <li class="daytimeshow hideElement tuesdaylisting">TUESDAY<br>21:30</li>
    <li class="daytimeshow hideElement tuesdaylisting">TUESDAY<br>22:50</li>

    <li class="daytimeshow hideElement wednesdaylisting">WEDNESDAY<br>10:45</li>
    <li class="daytimeshow hideElement wednesdaylisting">WEDNESDAY<br>13:10</li>
    <li class="daytimeshow hideElement wednesdaylisting">WEDNESDAY<br>15:45</li>
    <li class="daytimeshow hideElement wednesdaylisting">WEDNESDAY<br>18:25</li>
    <li class="daytimeshow hideElement wednesdaylisting">WEDNESDAY<br>20:30</li>
    <li class="daytimeshow hideElement wednesdaylisting">WEDNESDAY<br>21:50</li>

    <li class="daytimeshow hideElement thursdaylisting">THURSDAY<br>11:20</li>
    <li class="daytimeshow hideElement thursdaylisting">THURSDAY<br>14:45</li>
    <li class="daytimeshow hideElement thursdaylisting">THURSDAY<br>16:50</li>
    <li class="daytimeshow hideElement thursdaylisting">THURSDAY<br>18:00</li>
    <li class="daytimeshow hideElement thursdaylisting">THURSDAY<br>19:45</li>
    <li class="daytimeshow hideElement thursdaylisting">THURSDAY<br>22:15</li>

    <li class="daytimeshow hideElement fridaylisting">FRIDAY<br>10:45</li>
    <li class="daytimeshow hideElement fridaylisting">FRIDAY<br>13:10</li>
    <li class="daytimeshow hideElement fridaylisting">FRIDAY<br>15:45</li>
    <li class="daytimeshow hideElement fridaylisting">FRIDAY<br>18:25</li>
    <li class="daytimeshow hideElement fridaylisting">FRIDAY<br>20:30</li>
    <li class="daytimeshow hideElement fridaylisting">FRIDAY<br>21:50</li>

    <li class="daytimeshow hideElement saturdaylisting">SATURDAY<br>13:15</li>
    <li class="daytimeshow hideElement saturdaylisting">SATURDAY<br>14:30</li>
    <li class="daytimeshow hideElement saturdaylisting">SATURDAY<br>18:10</li>
    <li class="daytimeshow hideElement saturdaylisting">SATURDAY<br>19:45</li>
    <li class="daytimeshow hideElement saturdaylisting">SATURDAY<br>20:15</li>
    <li class="daytimeshow hideElement saturdaylisting">SATURDAY<br>22:30</li>

    <li class="daytimeshow hideElement sundaylisting">SUNDAY<br>14:45</li>
    <li class="daytimeshow hideElement sundaylisting">SUNDAY<br>16:30</li>
    <li class="daytimeshow hideElement sundaylisting">SUNDAY<br>18:10</li>
    <li class="daytimeshow hideElement sundaylisting">SUNDAY<br>20:35</li>
    <li class="daytimeshow hideElement sundaylisting">SUNDAY<br>21:15</li>
    <li class="daytimeshow hideElement sundaylisting">SUNDAY<br>22:45</li>

</div>

</div>

<div class="classic-movie">

  <div class="movie-summary">

    <div class="movie-image">

      <img src="images/movie-images/back-to-the-future.jpg" class="movie-thumbnail">

    </div>

    <div class="movie-name-plot">

      <h1>Back to the Future (1985)</h1>

      <p>Marty McFly, a typical American teenager of the Eighties, is accidentally sent back to 1955 in a plutonium-powered DeLorean 'time machine' invented by a slightly mad scientist. During his often hysterical, always amazing trip back in time, Marty
        must make certain his teenage parents-to-be meet and fall in love - so he can get back to the future.</p>

      <p><span class="white-mini-header">Starring:</span> Michael J. Fox, Christopher Lloyd, Lea Thompson</p>

      <p><span class="white-mini-header">Runtime:</span>116 min</p>

    </div>

  </div>

  <div class="movie-showtimes">

    <ul class="movie-timing mon-listings">

      <li class="daytimeshow mondaylisting">MONDAY<br>11:20</li>
      <li class="daytimeshow mondaylisting">MONDAY<br>14:45</li>
      <li class="daytimeshow mondaylisting">MONDAY<br>16:50</li>
      <li class="daytimeshow mondaylisting">MONDAY<br>18:00</li>
      <li class="daytimeshow mondaylisting">MONDAY<br>19:45</li>
      <li class="daytimeshow mondaylisting">MONDAY<br>22:15</li>

      <li class="daytimeshow hideElement tuesdaylisting">TUESDAY<br>14:45</li>
      <li class="daytimeshow hideElement tuesdaylisting">TUESDAY<br>16:30</li>
      <li class="daytimeshow hideElement tuesdaylisting">TUESDAY<br>18:10</li>
      <li class="daytimeshow hideElement tuesdaylisting">TUESDAY<br>20:35</li>
      <li class="daytimeshow hideElement tuesdaylisting">TUESDAY<br>21:15</li>
      <li class="daytimeshow hideElement tuesdaylisting">TUESDAY<br>22:45</li>

      <li class="daytimeshow hideElement wednesdaylisting">WEDNESDAY<br>10:45</li>
      <li class="daytimeshow hideElement wednesdaylisting">WEDNESDAY<br>13:10</li>
      <li class="daytimeshow hideElement wednesdaylisting">WEDNESDAY<br>15:45</li>
      <li class="daytimeshow hideElement wednesdaylisting">WEDNESDAY<br>18:25</li>
      <li class="daytimeshow hideElement wednesdaylisting">WEDNESDAY<br>20:30</li>
      <li class="daytimeshow hideElement wednesdaylisting">WEDNESDAY<br>21:50</li>

      <li class="daytimeshow hideElement thursdaylisting">THURSDAY<br>11:20</li>
      <li class="daytimeshow hideElement thursdaylisting">THURSDAY<br>14:45</li>
      <li class="daytimeshow hideElement thursdaylisting">THURSDAY<br>16:50</li>
      <li class="daytimeshow hideElement thursdaylisting">THURSDAY<br>18:00</li>
      <li class="daytimeshow hideElement thursdaylisting">THURSDAY<br>19:45</li>
      <li class="daytimeshow hideElement thursdaylisting">THURSDAY<br>22:15</li>

      <li class="daytimeshow hideElement fridaylisting">FRIDAY<br>10:45</li>
      <li class="daytimeshow hideElement fridaylisting">FRIDAY<br>13:10</li>
      <li class="daytimeshow hideElement fridaylisting">FRIDAY<br>15:45</li>
      <li class="daytimeshow hideElement fridaylisting">FRIDAY<br>18:25</li>
      <li class="daytimeshow hideElement fridaylisting">FRIDAY<br>20:30</li>
      <li class="daytimeshow hideElement fridaylisting">FRIDAY<br>21:50</li>

      <li class="daytimeshow hideElement saturdaylisting">SATURDAY<br>13:15</li>
      <li class="daytimeshow hideElement saturdaylisting">SATURDAY<br>14:30</li>
      <li class="daytimeshow hideElement saturdaylisting">SATURDAY<br>18:10</li>
      <li class="daytimeshow hideElement saturdaylisting">SATURDAY<br>19:45</li>
      <li class="daytimeshow hideElement saturdaylisting">SATURDAY<br>20:15</li>
      <li class="daytimeshow hideElement saturdaylisting">SATURDAY<br>22:30</li>

      <li class="daytimeshow hideElement sundaylisting">SUNDAY<br>14:45</li>
      <li class="daytimeshow hideElement sundaylisting">SUNDAY<br>16:30</li>
      <li class="daytimeshow hideElement sundaylisting">SUNDAY<br>18:10</li>
      <li class="daytimeshow hideElement sundaylisting">SUNDAY<br>20:35</li>
      <li class="daytimeshow hideElement sundaylisting">SUNDAY<br>21:15</li>
      <li class="daytimeshow hideElement sundaylisting">SUNDAY<br>22:45</li>

    </ul>

  </div>

</div>

<div class="classic-movie">

  <div class="movie-summary">

    <div class="movie-image">

      <img src="images/movie-images/first-blood.jpg" class="movie-thumbnail">

    </div>

    <div class="movie-name-plot">

      <h1>First Blood (1982)</h1>

      <p>John Rambo is a disoriented Vietnam Vet. He is hitchhiking from town to town to see friends from the war. A sheriff tries to make him leave town and when he refuses, arrests him for vagrancy. While in jail, a deputy takes delight in abusing him.
        Rambo escapes showing his old Vietnam fighting skills and takes to the woods as the sheriff and deputies try and find him in his element. Things get out of hand as Colonel Trautman, Rambo's old commander, appears to shed light on the situation.</p>

      <p><span class="white-mini-header">Starring:</span>Sylvester Stallone, Brian Dennehy, Richard Crenna</p>

      <p><span class="white-mini-header">Runtime:</span>93 min</p>

    </div>

  </div>

  <div class="movie-showtimes">

    <ul class="movie-timing mon-listings">

      <li class="daytimeshow mondaylisting">MONDAY<br>10:45</li>
      <li class="daytimeshow mondaylisting">MONDAY<br>13:30</li>
      <li class="daytimeshow mondaylisting">MONDAY<br>17:00</li>
      <li class="daytimeshow mondaylisting">MONDAY<br>18:45</li>
      <li class="daytimeshow mondaylisting">MONDAY<br>20:15</li>
      <li class="daytimeshow mondaylisting">MONDAY<br>22:00</li>

      <li class="daytimeshow hideElement tuesdaylisting">TUESDAY<br>13:50</li>
      <li class="daytimeshow hideElement tuesdaylisting">TUESDAY<br>15:10</li>
      <li class="daytimeshow hideElement tuesdaylisting">TUESDAY<br>17:30</li>
      <li class="daytimeshow hideElement tuesdaylisting">TUESDAY<br>20:00</li>
      <li class="daytimeshow hideElement tuesdaylisting">TUESDAY<br>21:30</li>
      <li class="daytimeshow hideElement tuesdaylisting">TUESDAY<br>22:50</li>

      <li class="daytimeshow hideElement wednesdaylisting">WEDNESDAY<br>14:45</li>
      <li class="daytimeshow hideElement wednesdaylisting">WEDNESDAY<br>16:30</li>
      <li class="daytimeshow hideElement wednesdaylisting">WEDNESDAY<br>18:10</li>
      <li class="daytimeshow hideElement wednesdaylisting">WEDNESDAY<br>20:35</li>
      <li class="daytimeshow hideElement wednesdaylisting">WEDNESDAY<br>21:15</li>
      <li class="daytimeshow hideElement wednesdaylisting">WEDNESDAY<br>22:45</li>

      <li class="daytimeshow hideElement thursdaylisting">THURSDAY<br>11:20</li>
      <li class="daytimeshow hideElement thursdaylisting">THURSDAY<br>14:45</li>
      <li class="daytimeshow hideElement thursdaylisting">THURSDAY<br>16:50</li>
      <li class="daytimeshow hideElement thursdaylisting">THURSDAY<br>18:00</li>
      <li class="daytimeshow hideElement thursdaylisting">THURSDAY<br>19:45</li>
      <li class="daytimeshow hideElement thursdaylisting">THURSDAY<br>22:15</li>

      <li class="daytimeshow hideElement fridaylisting">FRIDAY<br>10:45</li>
      <li class="daytimeshow hideElement fridaylisting">FRIDAY<br>13:10</li>
      <li class="daytimeshow hideElement fridaylisting">FRIDAY<br>15:45</li>
      <li class="daytimeshow hideElement fridaylisting">FRIDAY<br>18:25</li>
      <li class="daytimeshow hideElement fridaylisting">FRIDAY<br>20:30</li>
      <li class="daytimeshow hideElement fridaylisting">FRIDAY<br>21:50</li>

      <li class="daytimeshow hideElement saturdaylisting">SATURDAY<br>13:15</li>
      <li class="daytimeshow hideElement saturdaylisting">SATURDAY<br>14:30</li>
      <li class="daytimeshow hideElement saturdaylisting">SATURDAY<br>18:10</li>
      <li class="daytimeshow hideElement saturdaylisting">SATURDAY<br>19:45</li>
      <li class="daytimeshow hideElement saturdaylisting">SATURDAY<br>20:15</li>
      <li class="daytimeshow hideElement saturdaylisting">SATURDAY<br>22:30</li>

      <li class="daytimeshow hideElement sundaylisting">SUNDAY<br>14:45</li>
      <li class="daytimeshow hideElement sundaylisting">SUNDAY<br>16:30</li>
      <li class="daytimeshow hideElement sundaylisting">SUNDAY<br>18:10</li>
      <li class="daytimeshow hideElement sundaylisting">SUNDAY<br>20:35</li>
      <li class="daytimeshow hideElement sundaylisting">SUNDAY<br>21:15</li>
      <li class="daytimeshow hideElement sundaylisting">SUNDAY<br>22:45</li>

    </ul>


  </div>

</div>

<div class="classic-movie">

  <div class="movie-summary">

    <div class="movie-image">

      <img src="images/movie-images/breakfast-club.jpg" class="movie-thumbnail">

    </div>

    <div class="movie-name-plot">

      <h1>The Breakfast Club (1985)</h1>

      <p>They were five students with nothing in common, faced with spending a Saturday detention together in their high school library. At 7 a.m., they had nothing to say, but by 4 p.m., they had bared their souls to each other and become good friends.
        To the outside world they were simply a Brain, an Athlete, a Basket Case, a Princess, and a Criminal, but to each other, they would always be the Breakfast Club.</p>

      <p><span class="white-mini-header">Starring:</span>Emilio Estevez, Judd Nelson, Molly Ringwald</p>

      <p><span class="white-mini-header">Runtime:</span>97 min</p>

    </div>

  </div>

  <div class="movie-showtimes">

    <ul class="movie-timing mon-listings">

      <li class="daytimeshow mondaylisting">MONDAY<br>13:15</li>
      <li class="daytimeshow mondaylisting">MONDAY<br>14:30</li>
      <li class="daytimeshow mondaylisting">MONDAY<br>18:10</li>
      <li class="daytimeshow mondaylisting">MONDAY<br>19:45</li>
      <li class="daytimeshow mondaylisting">MONDAY<br>20:15</li>
      <li class="daytimeshow mondaylisting">MONDAY<br>22:30</li>

      <li class="daytimeshow hideElement tuesdaylisting">TUESDAY<br>13:50</li>
      <li class="daytimeshow hideElement tuesdaylisting">TUESDAY<br>15:10</li>
      <li class="daytimeshow hideElement tuesdaylisting">TUESDAY<br>17:30</li>
      <li class="daytimeshow hideElement tuesdaylisting">TUESDAY<br>20:00</li>
      <li class="daytimeshow hideElement tuesdaylisting">TUESDAY<br>21:30</li>
      <li class="daytimeshow hideElement tuesdaylisting">TUESDAY<br>22:50</li>

      <li class="daytimeshow hideElement wednesdaylisting">WEDNESDAY<br>10:45</li>
      <li class="daytimeshow hideElement wednesdaylisting">WEDNESDAY<br>13:10</li>
      <li class="daytimeshow hideElement wednesdaylisting">WEDNESDAY<br>15:45</li>
      <li class="daytimeshow hideElement wednesdaylisting">WEDNESDAY<br>18:25</li>
      <li class="daytimeshow hideElement wednesdaylisting">WEDNESDAY<br>20:30</li>
      <li class="daytimeshow hideElement wednesdaylisting">WEDNESDAY<br>21:50</li>

      <li class="daytimeshow hideElement thursdaylisting">THURSDAY<br>11:20</li>
      <li class="daytimeshow hideElement thursdaylisting">THURSDAY<br>14:45</li>
      <li class="daytimeshow hideElement thursdaylisting">THURSDAY<br>16:50</li>
      <li class="daytimeshow hideElement thursdaylisting">THURSDAY<br>18:00</li>
      <li class="daytimeshow hideElement thursdaylisting">THURSDAY<br>19:45</li>
      <li class="daytimeshow hideElement thursdaylisting">THURSDAY<br>22:15</li>

      <li class="daytimeshow hideElement fridaylisting">FRIDAY<br>10:45</li>
      <li class="daytimeshow hideElement fridaylisting">FRIDAY<br>13:10</li>
      <li class="daytimeshow hideElement fridaylisting">FRIDAY<br>15:45</li>
      <li class="daytimeshow hideElement fridaylisting">FRIDAY<br>18:25</li>
      <li class="daytimeshow hideElement fridaylisting">FRIDAY<br>20:30</li>
      <li class="daytimeshow hideElement fridaylisting">FRIDAY<br>21:50</li>

      <li class="daytimeshow hideElement saturdaylisting">SATURDAY<br>13:15</li>
      <li class="daytimeshow hideElement saturdaylisting">SATURDAY<br>14:30</li>
      <li class="daytimeshow hideElement saturdaylisting">SATURDAY<br>18:10</li>
      <li class="daytimeshow hideElement saturdaylisting">SATURDAY<br>19:45</li>
      <li class="daytimeshow hideElement saturdaylisting">SATURDAY<br>20:15</li>
      <li class="daytimeshow hideElement saturdaylisting">SATURDAY<br>22:30</li>

      <li class="daytimeshow hideElement sundaylisting">SUNDAY<br>14:45</li>
      <li class="daytimeshow hideElement sundaylisting">SUNDAY<br>16:30</li>
      <li class="daytimeshow hideElement sundaylisting">SUNDAY<br>18:10</li>
      <li class="daytimeshow hideElement sundaylisting">SUNDAY<br>20:35</li>
      <li class="daytimeshow hideElement sundaylisting">SUNDAY<br>21:15</li>
      <li class="daytimeshow hideElement sundaylisting">SUNDAY<br>22:45</li>

    </ul>


  </div>

</div>

<div class="classic-movie">

  <div class="movie-summary">

    <div class="movie-image">

      <img src="images/movie-images/halloween.jpg" class="movie-thumbnail">

    </div>

    <div class="movie-name-plot">

      <h1>Halloween (1979)</h1>

      <p>The year is 1963, the night: Halloween. Police are called to 43 Lampkin Ln. only to discover that 15 year old Judith Myers has been stabbed to death, by her 6 year-old brother, Michael. After being institutionalized for 15 years, Myers breaks out
        on the night before Halloween. No one knows, nor wants to find out, what will happen on October 31st 1978 besides Myers' psychiatrist, Dr. Loomis. He knows Michael is coming back to Haddonfield, but by the time the town realizes it, it'll be too
        late for many people.</p>

      <p><span class="white-mini-header">Starring:</span>Donald Pleasence, Jamie Lee Curtis, Tony Moran</p>

      <p><span class="white-mini-header">Runtime:</span>91 min</p>

    </div>

  </div>

  <div class="movie-showtimes">

    <ul class="movie-timing mon-listings">

      <li class="daytimeshow mondaylisting">MONDAY<br>14:45</li>
      <li class="daytimeshow mondaylisting">MONDAY<br>16:30</li>
      <li class="daytimeshow mondaylisting">MONDAY<br>18:10</li>
      <li class="daytimeshow mondaylisting">MONDAY<br>20:35</li>
      <li class="daytimeshow mondaylisting">MONDAY<br>21:15</li>
      <li class="daytimeshow mondaylisting">MONDAY<br>22:45</li>

      <li class="daytimeshow hideElement tuesdaylisting">TUESDAY<br>13:30</li>
      <li class="daytimeshow hideElement tuesdaylisting">TUESDAY<br>15:00</li>
      <li class="daytimeshow hideElement tuesdaylisting">TUESDAY<br>18:00</li>
      <li class="daytimeshow hideElement tuesdaylisting">TUESDAY<br>18:15</li>
      <li class="daytimeshow hideElement tuesdaylisting">TUESDAY<br>21:30</li>
      <li class="daytimeshow hideElement tuesdaylisting">TUESDAY<br>22:15</li>

      <li class="daytimeshow hideElement wednesdaylisting">WEDNESDAY<br>16:30</li>
      <li class="daytimeshow hideElement wednesdaylisting">WEDNESDAY<br>17:00</li>
      <li class="daytimeshow hideElement wednesdaylisting">WEDNESDAY<br>19:45</li>
      <li class="daytimeshow hideElement wednesdaylisting">WEDNESDAY<br>20:00</li>
      <li class="daytimeshow hideElement wednesdaylisting">WEDNESDAY<br>21:45</li>
      <li class="daytimeshow hideElement wednesdaylisting">WEDNESDAY<br>22:30</li>

      <li class="daytimeshow hideElement thursdaylisting">THURSDAY<br>12:30</li>
      <li class="daytimeshow hideElement thursdaylisting">THURSDAY<br>13:30</li>
      <li class="daytimeshow hideElement thursdaylisting">THURSDAY<br>15:15</li>
      <li class="daytimeshow hideElement thursdaylisting">THURSDAY<br>16:15</li>
      <li class="daytimeshow hideElement thursdaylisting">THURSDAY<br>19:00</li>
      <li class="daytimeshow hideElement thursdaylisting">THURSDAY<br>22:30</li>

      <li class="daytimeshow hideElement fridaylisting">FRIDAY<br>16:30</li>
      <li class="daytimeshow hideElement fridaylisting">FRIDAY<br>17:00</li>
      <li class="daytimeshow hideElement fridaylisting">FRIDAY<br>19:45</li>
      <li class="daytimeshow hideElement fridaylisting">FRIDAY<br>20:00</li>
      <li class="daytimeshow hideElement fridaylisting">FRIDAY<br>21:45</li>
      <li class="daytimeshow hideElement fridaylisting">FRIDAY<br>22:30</li>

      <li class="daytimeshow hideElement saturdaylisting">SATURDAY<br>14:45</li>
      <li class="daytimeshow hideElement saturdaylisting">SATURDAY<br>16:30</li>
      <li class="daytimeshow hideElement saturdaylisting">SATURDAY<br>18:10</li>
      <li class="daytimeshow hideElement saturdaylisting">SATURDAY<br>20:35</li>
      <li class="daytimeshow hideElement saturdaylisting">SATURDAY<br>21:15</li>
      <li class="daytimeshow hideElement saturdaylisting">SATURDAY<br>22:45</li>

      <li class="daytimeshow hideElement sundaylisting">SUNDAY<br>12:30</li>
      <li class="daytimeshow hideElement sundaylisting">SUNDAY<br>13:30</li>
      <li class="daytimeshow hideElement sundaylisting">SUNDAY<br>15:15</li>
      <li class="daytimeshow hideElement sundaylisting">SUNDAY<br>16:15</li>
      <li class="daytimeshow hideElement sundaylisting">SUNDAY<br>19:00</li>
      <li class="daytimeshow hideElement sundaylisting">SUNDAY<br>22:30</li>

    </ul>


  </div>

</div>

<div class="classic-movie">

  <div class="movie-summary">

    <div class="movie-image">

      <img src="images/movie-images/goodfellas.jpg" class="movie-thumbnail">

    </div>

    <div class="movie-name-plot">

      <h1>Goodfellas (1990)</h1>

      <p>Henry Hill might be a small time gangster, who may have taken part in a robbery with Jimmy Conway and Tommy De Vito, two other gangsters who might have set their sights a bit higher. His two partners could kill off everyone else involved in the
        robbery, and slowly start to think about climbing up through the hierarchy of the Mob. Henry, however, might be badly affected by his partners' success, but will he consider stooping low enough to bring about the downfall of Jimmy and Tommy?</p>

      <p><span class="white-mini-header">Starring:</span>Robert De Niro, Ray Liotta, Joe Pesci</p>

      <p><span class="white-mini-header">Runtime:</span>146 min</p>

    </div>

  </div>

  <div class="movie-showtimes">

    <ul class="movie-timing mon-listings show">

      <li class="daytimeshow mondaylisting">MONDAY<br>12:25</li>
      <li class="daytimeshow mondaylisting">MONDAY<br>13:30</li>
      <li class="daytimeshow mondaylisting">MONDAY<br>14:50</li>
      <li class="daytimeshow mondaylisting">MONDAY<br>17:35</li>
      <li class="daytimeshow mondaylisting">MONDAY<br>20:15</li>
      <li class="daytimeshow mondaylisting">MONDAY<br>22:30</li>

      <li class="daytimeshow hideElement tuesdaylisting">TUESDAY<br>13:50</li>
      <li class="daytimeshow hideElement tuesdaylisting">TUESDAY<br>15:10</li>
      <li class="daytimeshow hideElement tuesdaylisting">TUESDAY<br>17:30</li>
      <li class="daytimeshow hideElement tuesdaylisting">TUESDAY<br>20:00</li>
      <li class="daytimeshow hideElement tuesdaylisting">TUESDAY<br>21:30</li>
      <li class="daytimeshow hideElement tuesdaylisting">TUESDAY<br>22:50</li>

      <li class="daytimeshow hideElement wednesdaylisting">WEDNESDAY<br>10:45</li>
      <li class="daytimeshow hideElement wednesdaylisting">WEDNESDAY<br>13:10</li>
      <li class="daytimeshow hideElement wednesdaylisting">WEDNESDAY<br>15:45</li>
      <li class="daytimeshow hideElement wednesdaylisting">WEDNESDAY<br>18:25</li>
      <li class="daytimeshow hideElement wednesdaylisting">WEDNESDAY<br>20:30</li>
      <li class="daytimeshow hideElement wednesdaylisting">WEDNESDAY<br>21:50</li>

      <li class="daytimeshow hideElement thursdaylisting">THURSDAY<br>11:20</li>
      <li class="daytimeshow hideElement thursdaylisting">THURSDAY<br>14:45</li>
      <li class="daytimeshow hideElement thursdaylisting">THURSDAY<br>16:50</li>
      <li class="daytimeshow hideElement thursdaylisting">THURSDAY<br>18:00</li>
      <li class="daytimeshow hideElement thursdaylisting">THURSDAY<br>19:45</li>
      <li class="daytimeshow hideElement thursdaylisting">THURSDAY<br>22:15</li>

      <li class="daytimeshow hideElement fridaylisting">FRIDAY<br>10:45</li>
      <li class="daytimeshow hideElement fridaylisting">FRIDAY<br>13:10</li>
      <li class="daytimeshow hideElement fridaylisting">FRIDAY<br>15:45</li>
      <li class="daytimeshow hideElement fridaylisting">FRIDAY<br>18:25</li>
      <li class="daytimeshow hideElement fridaylisting">FRIDAY<br>20:30</li>
      <li class="daytimeshow hideElement fridaylisting">FRIDAY<br>21:50</li>

      <li class="daytimeshow hideElement saturdaylisting">SATURDAY<br>13:15</li>
      <li class="daytimeshow hideElement saturdaylisting">SATURDAY<br>14:30</li>
      <li class="daytimeshow hideElement saturdaylisting">SATURDAY<br>18:10</li>
      <li class="daytimeshow hideElement saturdaylisting">SATURDAY<br>19:45</li>
      <li class="daytimeshow hideElement saturdaylisting">SATURDAY<br>20:15</li>
      <li class="daytimeshow hideElement saturdaylisting">SATURDAY<br>22:30</li>

      <li class="daytimeshow hideElement sundaylisting">SUNDAY<br>14:45</li>
      <li class="daytimeshow hideElement sundaylisting">SUNDAY<br>16:30</li>
      <li class="daytimeshow hideElement sundaylisting">SUNDAY<br>18:10</li>
      <li class="daytimeshow hideElement sundaylisting">SUNDAY<br>20:35</li>
      <li class="daytimeshow hideElement sundaylisting">SUNDAY<br>21:15</li>
      <li class="daytimeshow hideElement sundaylisting">SUNDAY<br>22:45</li>

    </ul>


  </div>

</div>

</div>

相关问题
最新问题