jQuery change le style d'un élément HTML

Question

J'ai une liste sur HTML

<div id="header" class="row">
    <div id="logo" class="col_12">And the winner is<span>n't...</span></div> 
    <div id="navigation" class="row"> 
        <ul id="pirra">
            <li><a href="#">Why?</a></li>
            <li><a href="#">Synopsis</a></li>
            <li><a href="#">Stills/Photos</a></li>
            <li><a href="#">Videos/clips</a></li>
            <li><a href="#">Quotes</a></li>
            <li><a href="#">Quiz</a></li>
        </ul>
    </div>  

il change bien pour s'afficher horizontalement sur le changement de CSS

div#navigation ul li { 
    display: inline-block;
}

mais maintenant je veux le faire avec jQuery, j'utilise :

$(document).ready(function() {
    console.log('hello');
    $('#navigation ul li').css('display': 'inline-block');
});

mais cela ne fonctionne pas, qu'est-ce que j'ai de mal à styliser mon élément avec jQuery ?

merci

Answer 1

Changer de style avec jquery

Essayez ceci

$('#selector_id').css('display','none');

Vous pouvez également modifier plusieurs attributs dans une seule requête.

Essayez ceci

$('#replace-div').css({'padding-top': '5px' , 'margin' : '10px'});

Answer 2

Obtenir le deuxième élément à l'intérieur d'un <div> avec un spécifique id et changer le style :

var post_id = 7;
var heart = $('#' + post_id).children().eq(1);
heart.css('color','red');

Note : Cela peut sembler évident mais cela m'a troublé et peut aussi vous arriver. Assurez-vous que le style que vous voulez modifier est de la div elle-même et non un dans cette div . Ainsi, par exemple, vous pouvez avoir quelque chose comme :

<div class="loves_it"><i class="fas fa-heart" style="color:gray"></i></div>

Et évidemment css() de Jquery ne fonctionnera pas. Assurez-vous donc que c'est comme suit :

<div class="loves_it" style="color:gray"><i class="fas fa-heart"></i></div>