Toggle slider
$(document).ready(function() {
if($(window).width() <= 768 ){// only for mobile
$(".cvElement").each(function(){
if($(this).hasClass('open')){
$(this).find('.cvElementContent').show();
}
}) // each
$(".wrapperCvTitle").each(function(){
$(this).click(function() {
if($(this).parent('.cvElement').hasClass('open')){
$(this).parent('.cvElement').removeClass('open').find('.cvElementContent').slideToggle( "slow" );
}else{
$(this).parent('.cvElement').addClass('open').find('.cvElementContent').slideToggle( "slow" );
}
}); //click
}) // each
}; // Width 768
}); // Docuemnt Ready
<div class="wrapperCv">
<div class="cvElement open wraperExtract col-xs-12">
<div class="wrapperCvTitle">
<h1 class="cvElementTitle">Personal presentation</h1>
<i class="fa fa-arrow-circle-right"></i>
<i class="fa fa-arrow-circle-down"></i>
</div>
<div class="cvElementContent">
<img class="profilePhoto" src="<?php echo get_template_directory_uri() ?>/img/pablo-cattaneo.jpg" alt="Pablo Cattaneo">
<p>My name is Pablo Cattaneo I am a front-end web developer. First of all I’m a person that really loves his profession. I'm proactive and very passionate, I'm all the time trying to improve the projects and the team environment in which I work as well as my skills as developer.</p>
<p>Over 5 years of business experience let me deep understanding of both sides of a site, the site owner and the end user. That's why I put all my efforts into building usable sites optimized with available resources.<p>
<p>I have experience working with Scrum and I consider it a great way to work. Since applying this model can optimize resources and build a robust product while excellent communication between the development team and the end customer is maintained.</p>
</div>
</div> <!-- wraperExtract -->
<div class="cvElement wraperPersonalInformation col-xs-12">
<div class="wrapperCvTitle">
<h1 class="cvElementTitle">Personal Information</h1>
<i class="fa fa-arrow-circle-right"></i>
<i class="fa fa-arrow-circle-down"></i>
</div>
<div class="cvElementContent">
<ul>
<li>
<span class="key"><i class="fa fa-user"></i>Names:</span><span class="value">Pablo Ignacio</span>
</li>
<li>
<span class="key"><i class="fa fa-user"></i>Last Name:</span><span class="value">Cattaneo Indurain</span>
</li>
<li>
<span class="key"><i class="fa fa-birthday-cake"></i>Date of birth:</span><span class="value">10/09/1982</span>
</li>
<li>
<span class="key"><i class="fa fa-user"></i>Citizenship:</span><span class="value">Argentina</span>
</li>
<li>
<span class="key"><i class="fa fa-user"></i>Age:</span><span class="value">33</span>
</li>
<li>
<span class="key"><i class="fa fa-user"></i>D.N.I:</span><span class="value">29370841</span>
</li>
<li>
<span class="key"><i class="fa fa-male"></i>Marital Status:</span><span class="value">Single</span>
</li>
<li>
<span class="key"><i class="fa fa-globe"></i>Country:</span><span class="value">Argentina</span>
</li>
<li>
<span class="key"><i class="fa fa-globe"></i>State:</span><span class="value">Santa Fe</span>
</li>
<li>
<span class="key"><i class="fa fa-home"></i>Address:</span><span class="value">Crespo 3350 Dpto 4B</span>
</li>
<li>
<span class="key"><i class="fa fa-phone"></i>Phone:</span><span class="value">+54 0342 4831577</span>
</li>
<li>
<span class="key"><i class="fa fa-mobile"></i>Cell phone:</span><span class="value">+54 0342154463937</span>
</li>
<li>
<span class="key"><i class="fa fa-linkedin"></i>Linkedin:</span><span class="value"><a target="_blank" href="https://ar.linkedin.com/in/cattaneopablo">Profile</a></span>
</li>
<li>
<span class="key"><i class="fa fa-envelope-o"></i>Email:</span><span class="value">pablocattaneo1@gmail.com</span>
</li>
<li>
<span class="key"><i class="fa fa-twitter"></i>Twitter:</span><span class="value">@Cattaneo_pablo</span>
</li>
<li>
<span class="key"><i class="fa fa-skype"></i>Skype:</span><span class="value">pablo-cattaneo</span>
</li>
</ul>
</div><!-- wraperDatosPersonales -->
</div>
<div class="cvElement wrapperWorkExperience col-xs-12">
<div class="wrapperCvTitle">
<h1 class="cvElementTitle">Work Experience</h1>
<i class="fa fa-arrow-circle-right"></i>
<i class="fa fa-arrow-circle-down"></i>
</div>
<div class="cvElementContent">
TopGroup: http://www.topgroup.com.ar/
May 2015 Present
FrontEnd Developer.
Applied technologies: Html5, Css3,Stylus, Less, JQuery, JQuery Mobile, JQuery
Bootstrap, Wordpress, Magento, Svn.
Keetup http://www.keetup.com/
Octubre 2013 Enero 2015
FrontEnd Developer / Quality Assurance / UX Designer
Applied technologies: Elgg, Jquery, Html5, Css3, Git
4rsoluciones http://www.4rsoluciones.com/
July 2012 Octubre 2013
FrontEnd Developer
Applied technologies: Wordpress, Synfony2, Moodle, JQuery, Html5, Css3,Git
</div><!-- wraperDatosPersonales -->
</div>
</div><!-- wrapperCv -->
.cvElement.open i.fa-arrow-circle-right,
.cvElement i.fa-arrow-circle-down{
display: none;
}
.cvElement.open .fa-arrow-circle-down,
.fa-arrow-circle-right{
display: inline-block;
}