Home/ Questions/Q 8686987
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-12T23:00:22+00:00

So I’m trying to change the a.heart when there is td.opened == 24. I’m

  • 0

So I’m trying to change the a.heart when there is td.opened == 24. I’m not sure what’s going wrong though since nothings happening.

HTML:

<body>
<header>
<div id="headerTitle"><a href="index.html">&lt;html<span class="heart">&hearts;</span>ve&gt;</a>
            </div>
            <div id="help">
                <h2>?</h2>
                <div id="helpInfo">
                    <p>How many tiles are there? Let's see [calculating] 25...</p>
                </div>
            </div>
        </header>
    <div id="reward">
        <div id="rewardContainer">
            <div id="rewardBG" class="heart">&hearts;
            </div>
            <p>OMG, this must be luv<br><a href="index.html" class="exit">x</a></p>
        </div>
    </div>  
    <div id="pageWrap">
            <div id="mainContent">
            <!-- DON'T BE A CHEATER !-->
                <table id="memory">
                    <tr>
                        <td class="pair1"><a>&Psi;</a></td>
                        <td class="pair2"><a>&para;</a></td>
                        <td class="pair3"><a>&Xi;</a></td>
                        <td class="pair1"><a>&Psi;</a></td>
                        <td class="pair4"><a >&otimes;</a></td>
                    </tr>
                    <tr>
                        <td class="pair5"><a>&spades;</a></td>
                        <td class="pair6"><a >&Phi;</a></td>
                        <td class="pair7"><a>&sect;</a></td>
                        <td class="pair8"><a>&clubs;</a></td>
                        <td class="pair4"><a>&otimes;</a></td>
                    </tr>
                    <tr>
                        <td class="pair9"><a>&Omega;</a></td>
                        <td class="pair2"><a>&para;</a></td>
                        <td id="goal">
                <a href="#reward" class="heart">&hearts;</a>
                        </td>
                        <td class="pair10"><a>&copy;</a></td>
                        <td class="pair9"><a>&Omega;</a></td>
                    </tr>
                    <tr>
                        <td class="pair11"><a>&there4;</a></td>
                        <td class="pair8"><a>&clubs;</a></td>
                        <td class="pair12"><a>&dagger;</a></td>
                        <td class="pair6"><a>&Phi;</a></td>
                        <td class="pair11"><a>&there4;</a></td>
                    </tr>
                    <tr>
                        <td><a class="pair12">&dagger;</a></td>
                        <td><a class="pair5">&spades;</a></td>
                        <td><a class="pair10">&copy;</a></td>
                        <td><a class="pair3">&Xi;</a></td>
                        <td><a class="pair7">&sect;</a></td>
                    </tr>
                </table>
            <!-- DON'T BE A CHEATER !-->
            </div>
    </div> <!-- END Page Wrap -->
    <footer>
        <div class="heartCollection">
            <p>collect us if u need luv:<p>
            <ul>
                <li><a id="collection1">&hearts;</a></li>
                <li><a id="collection2">&hearts;</a></li>
                <li><a id="collection3">&hearts;</a></li>
                <li><a id="collection4">&hearts;</a></li>
                <li><a id="collection5">&hearts;</a></li>
                <li><a id="collection6">&hearts;</a></li>
            </ul>
        </div>
        <div class="credits">with love from Popm0uth ©2012</div>
    </footer>

</body>
</html>

Javascript:

var thisCard = $(this).text();
var activeCard = $('.active').text();
var openedCards = $('.opened').length;

$(document).ready(function() {

$('a.heart').css('color', '#CCCCCC');
$('a.heart').off('click');

function reset(){
    $('td').removeClass('opened');
    $('a').removeClass('visible');
    $('td').removeClass('active');
};
    $('td').click(openCard);

    function openCard(){
        $(this).addClass('opened');
        $(this).find('a').addClass('visible');
        if ($(".active")[0]){ 
                if  ($(this).text() != $('.active').text()) {
                    setTimeout(function(){
                        reset();
                    }, 1000); 
                }       
                else {
                $('.active').removeClass('active');
                }
        }
        else {
            $(this).addClass("active");
        }
        if (openedCards == 24){
            $(".active").removeClass("active");
            $("a.heart").css('color', '#ff63ff');
            $("a.heart").off('click');
        }
    }
});
Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    That’s because $('.opened').length is computed only once in your code. The collection isn’t updated live when you change the classes of elements. And of course the number openedCards can’t change of its own.

    Replace

    if (openedCards == 24){

    by

    if ($('.opened').length == 24){

    to have it computed each time.

    • 0