witam, mam problem z funkcja ktora ma zmienic kolor tekstu w danej sekcji (sekcje sa 3) po nakliknieciu na slupek np zielony. Slupek ten powinnien sie powiekszyc o 20px. Po wybraniu innego koloru np czerwonego, slupek czerwony powinien sie powiekszyc o 20px a slupek zielony, zmniejszyc sie o 20px.

Uzywam takiego kodu js. Niby dziala ale nie dziala. W pierwszej sekcji, dzialaja wszystkie slupki oprocz czerwonego. W drugiej i trzeciej sekcji, dziala tylko kolor szary a reszta nie. W zadnej sekcji slupki sie nie powiekszaja

Kod
var colors = new Array();
colors[0] = "#ed1c24";
colors[1] = "#736257";
colors[2] = "#620460";
colors[3] = "#e87e01";
colors[4] = "#00a650";

function changeColor(numerSekcji, numerKoloru)
{
    document.getElementById('section' + numerSekcji + 'Color' + numerKoloru).style.paddingTop = 20 + "px";
    document.getElementById('section' + numerSekcji + 'Color' + numerKoloru).style.marginTop = 0 + "px";
    document.getElementById('section' + numerSekcji + 'Text').style.color = colors[numerKoloru];


    for (i = numerKoloru; i <= 4; i++) {
     document.getElementById('section' + numerSekcji + 'Color' + numerKoloru).style.padding =  0 + "px";
     document.getElementById('section' + numerSekcji + 'Color' + numerKoloru).style.marginTop =  20 + "px";
    
    
    }


}



a to jest kod do calej strony html

Kod
<body>
  
    <!-- Main wrapper for the whole content -->
    <div class="main">  
          

        <!-- Header -->
        <div id="header">
            <h1><span>Lorem ipsum</span> dolor sit amet...</h1>
        </div>
      
        <!-- End Header -->
      
        <!-- Form wrapper -->
            <div class="form_wrapper">
          
                <!-- Form id div -->
                <div id="form">
                    <label for="sections" id="wybierz">Wybierz sekcje</label>
                    <select id="sections">
                        <option value="sekcjaA">Sekcja A</option>
                        <option value="sekcjaB">Sekcja B</option>
                        <option value="sekcjaC">Sekcja C</option>
                    </select>                  
                  
                
                    <label for="tekst" id="wprowadz">Wprowadz tekst</label>
                    <textarea cols="45" rows="5" name="tekstForm" id="tekst" onclick="this.value=''"> </textarea>
                  
                  
                    <input type="submit" value="Wykonaj" id="wykonaj" onclick="copyText(); adjustT()" />
              
                </div>
                <!-- End Form id div -->
              
            </div>
            <!-- End Form wrapper -->
          
        <!-- Content wrapper -->
        <div class="content">
          
            <!-- Quote(s) wrapper -->
            <div class="quotes_wrapper">
              
                <!-- Quotes -->
                <div id="quotes">
                    Textblock for quotes
                </div>
                <!-- End quotes -->              
            
            </div>
            <!-- End quotes wrapper -->
          
          
          
            <!-- Wrapper for all section - to set the height -->
            <div class="sections_wrapper" id="clearfix">
          
                <!-- Section A Wrapper -->
                <div class="section1_wrapper">
                    <h1>Sekcja A</h1>
                  
                        <!-- Section A  -->
                        <div id="section1">
                      
                            <!-- section1Text -->
                            <div id="section1Text">
                          
                            </div>
                            <!-- End section1Text -->
                          
                          
                            <!-- Color Bars Wrapper-->
                            <div class="color_wrapper">
                          
                              
                                <a id="color1" href="java script:section1Color1()"> &nbsp; </a>
                                <a id="color2" href="java script:section1Color2()"> &nbsp; </a>
                                <a id="color3" href="java script:section1Color3()"> &nbsp; </a>
                                <a id="color4" href="java script:section1Color4()"> &nbsp; </a>
                                <a id="color5" href="java script:section1Color5()"> &nbsp; </a>
                                <!--Color bars -->
                              
                            </div>
                            <!-- End of Color Bars Wrapper -->
                        </div>
                        <!-- End Section A  -->
                  
                </div>
                <!-- End Section A wrapper -->
              
                <!-- Section B wrapper -->
                <div class="section2_wrapper">
                    <h1>Sekcja B</h1>
                  
                        <!-- Section B -->
                        <div id="section2">
                      
                            <!-- Section2Text - for text layout -->
                            <div id="section2Text">
                          
                            </div>
                            <!-- End section2Text -->
                          
                            <!-- Color Bars Wrapper-->
                            <div class="color_wrapper">
                          
                                <!--Color bars -->
                                <a id="color1" href="java script:section2Color1()"> &nbsp; </a>
                                <a id="color2" href="java script:section2Color2()"> &nbsp; </a>
                                <a id="color3" href="java script:section2Color3()"> &nbsp; </a>
                                <a id="color4" href="java script:section2Color4()"> &nbsp; </a>
                                <a id="color5" href="java script:section2Color5()"> &nbsp; </a>
                            </div>
                            <!-- End of Color Bars Wrapper -->
                          
                        </div>
                        <!-- End section B -->
                  
                </div>
                <!-- End ection B wrapper -->
              
                <!-- Section C wrapper -->
                <div class="section3_wrapper">
                    <h1>Sekcja C</h1>
                  
                        <!-- Section C -->
                        <div id="section3">
                      
                            <!-- section3Text -->
                            <div id="section3Text">
                          
                            </div>
                            <!-- End section4Text -->
                          
                            <!-- Color Bars Wrapper-->
                            <div class="color_wrapper">
                          
                                <!--Color bars -->
                                <a id="color1" href="java script:section3Color1()"> &nbsp; </a>
                                <a id="color2" href="java script:section3Color2()"> &nbsp; </a>
                                <a id="color3" href="java script:section3Color3()"> &nbsp; </a>
                                <a id="color4" href="java script:section3Color4()"> &nbsp; </a>
                                <a id="color5" href="java script:section3Color5()"> &nbsp; </a>
                            </div>
                            <!-- End of Color Bars Wrapper -->
                          
                        </div>
                        <!-- End Section C -->
                  
                </div>
                <!-- End Section C wrapper -->
            </div>
            <!-- End of content wrapper -->
          
          
        <!-- End of Sections_wrapper -->
        </div>
      
       <!-- Footer wrapper -->
        <div class="footer_wrapper">
      
            <!-- Footer -->
            <div id="footer">
              
            </div>
            <!-- End Footer -->
        

        </div>
        <!-- End Footer wrapper -->
      
   </div>
   <!-- End Main wrapper -->
  
  
  
</body>
</html>



nie mam pojecia co jest zle