Witam, stworzylem po czesci pole do mojej gry, z tym ze nie wiem jakie kroki podjac zeby stworzyc funkcje ktora bedzie zaznaczac w jakis sposob innym kolorem moje pola "buttony" gracza wygranego to znaczy np piec z rzedu w lini poziomej, pionowej, badz na ukos podobnie jak w grze ktora sie nazywa 'gomoku'. Wiem, ze nikt nie bedzie chcial umieszczac gotowego kodu ale jakie kroki podjac, tak żeby ktoś początkujący jak ja mógł jakoś do tego dojść, licze na pomoc, dziękuje:)
chodzi mi tylko o uzywanie JS nie PHP..

Kod
<html>
  <head>

  <title>PierwszaGra</title>
  </head>
  <body>
  <table id="tabelka"></table>
  <form name="formularz">
    <fieldset>
        <div>
            <label>Podaj dlugosc :</label>
            <input id="dlugoscc" name="" type="text" maxlength="2" length="20" />
        </div>
        
        <div>
            <label>Podaj szerokosc:</label>
            <input id="szerokoscc" name="" type="text" maxlength="2" length="20" />
        </div>
        
        <div>
            <input type="button" id="zapisz" value="Pokaz" />
            <a href="java script:location.reload()">
            <input type="button" id="zapisz" value="Odswiez" /></a>
        </div>
    </fieldset>
</form>
  
  
  <script>
  
  
   document.getElementById('zapisz').onclick = function(){
   var tab = document.getElementById('tabelka');
   var kurr = document.getElementById('dlugoscc').value;
    var kurrr = document.getElementById('szerokoscc').value;
     var wzor = /^\d+$/
     if (wzor.test(kurr) && wzor.test(kurrr) ) {
        

for(var y=1; y<=kurr; y++) {
    var tr = document.createElement('tr');
    
    for (var x=1; x<=kurrr; x++) {
        var u = document.createElement('button');
            u.style="width: 40px; height: 40px";
            u.style.backgroundColor = '#ffff33';
            
             u.onclick = function() {
              this.style.backgroundColor = '#33ff66';  
              }
              u.ondblclick = function() {
              this.style.backgroundColor = '#9932CD';    
              }
            
            if (y==1 || x==1) {
            var th = document.createElement('th');
            th.appendChild(u);
            tr.appendChild(th);
        } else {
            var td = document.createElement('td');
            td.appendChild(u);
            tr.appendChild(td);
        }
    }  
    
    tab.appendChild(tr);
}}  else {
        
        alert("Wypelnij wszystkie pola liczbami exclamation.gif!");
    } }


</script>
    

    
   </body>

</html>