Synchronizacja menu kropek z slajdami

Witam,

zaczynam się uczyć javascript biblioteki jquery i mam problem z synchronizacją kropek menu z slajdami.Mianowicie jak zaznaczam po kolei najpierw 2,3,4 kropkę to wtedy wszystko mi działa dobrze.Problem pojawia się kiedy zaznaczam od razu po załadowaniu strony kropkę 4 to wtedy pokazuje mi się 2 i wszystko się psuje.

Cały kod wrzuciłem Codepen.

http://codepen.io/Master7/pen/yOeMpo/

Proszę o pomoc.Chce zrobić slajder sam żeby się nauczyć a nie dodawać pluginy. Przepraszam za wszystkie błędy w nazewnictwie jeżeli miały miejsce.

Na początku wszystkie numery (które nazwałeś slajdami) są wyświetlone. A z tego co myślę to slajdy się wyświetla pojedynczo.
Niech jeden slajd jest wyświetlony na początku. Schowaj 3 pozostałe elementy (.hide()). A właściwie, czemu usuwasz klasę a potem chowasz element, jak wystarczy tylko schować, bądź tylko usunąć klase ? Może się mylę ale tak podpowiada mi logika.

haha no brzmi bardzo logicznie:D Tylko własnie nie wiem czemu te elementy mi się w ogóle nie pokazują jak nie pokazuje ich lubi nie ukrywam tylko działam na samych klasach.Wprowadziłem modyfikację i teraz to już nic nie działa ale sa same klasy :D

http://codepen.io/anon/pen/JXGMew?editors=0110