Search code examples
javascriptjqueryhtmllowercase

Change H1 content to lowercase with jquery

I'm looking for a way to tranform my H1's content (actually in uppercase) to lowercase. Ideally, it could be great to change it to the capitalize css setting of text-tranform property if exist in jquery.Why in jquery ? because the css way doesn't allowed me to do so .. This is my starting code:

$('h1').each(function(){
var h1content = $(this).val().toLowerCase();
$(this).text().toLowerCase();
 });

thanks

EDIT: fix it with adding this tips to the JS way , https://css-tricks.com/almanac/selectors/f/first-letter/

Sass code:

h1.titre-vdl{
    color: $violet;
    &::first-letter{
        text-transform: capitalize;
    }
}
Solution

  • Add text-transform css property to h1 tag to convert text to lowercase 

    $('h1').css('text-transform','lowercase');