Convert jquery Skript zu reinem Javascript

Question

Hier ist das Skript, das ich habe:

ich es rein JavaScript umwandeln möchte, so dass ich nicht jQuery verwenden.

if ($('#movie.playing').length) { 

    $('.settings').click(); 

    $('<style> .element { display: none; } </style>').appendTo(document.head); 

    $('.item').click(function() { 
     if ($(this).text().trim() === "Ann") { 
      if ($(this).attr('aria-checked') == 'true') { 
       $('.element').css('display', 'block'); 
      } else { 
       $('.element').css('display', 'none'); 
      } 
     } 
    }); 

} 

Hier ist, was ich bisher habe:

var movie = document.querySelector("#movie_player.playing-mode"); 
if (movie) { 

    document.querySelector(".settings").click(); 

    var style = document.createElement("text/css"); 
    style.styleSheet.cssText = ".element { display: none; }"; 
    document.head.appendChild(style); 

    document.querySelector(".item").click(function() { 
     /* what do I do with this part? */ 
     if ($(this).text().trim() === "Ann") { 
      if ($(this).attr('aria-checked') == 'true') { 
       $('.element').css('display', 'block'); 
      } else { 
       $('.element').css('display', 'none'); 
      } 
     } 

    }); 

} 

Ich weiß nicht, wie die if-Anweisung zu konvertieren, wo auf Klick auf den Button mit dem Text „Ann“ schalten wird sich die Elemente von display: block bis none und umgekehrt.

Answer 1

1. $ (Selektor) = document.querySelector (Selektor)
2. $ (Wähler) .click() = document.querySelector (Selektor) (vielleicht das Element cachen zuerst) .addEventlistener (eventtype, fn)
3. css stuff kann als 'class' wie el.classList.add (someClassName) hinzugefügt werden.

UPDATE

Es ist besser, die Grundkenntnisse mit JavaScript | MDN zu bekommen. Persönlich ist es einfach als jQuery.