So entfernen Sie mehrere CSS-Stile aus einem element.style

Question

Meine Anwendung generiert einige Inline-Stile. In bestimmten Punkt muss ich die height, die width und die max-width Stile entfernen.

Ich habe das Element wie folgt zu finden:

const elems = window.$('.myElements'); 
    window.$.each(elems, (index, value) => { 
     if (value.id.startsWith('myPanel')) { 

hier ich das versucht habe:

  window.$(value).css({height: '', maxWidth: '', width: ''}); 

und diese:

  window.$(value)[0].style.height = ''; 
     window.$(value)[0].style.width = ''; 
     window.$(value)[0].style.maxWidth = ''; 

auch dies:

  window.$(value).css('height', '');    
     window.$(value).css('max-width', ''); 
     window.$(value).css('width', ''); 
     } 
    }); 

und egal was es immer nur das erste Element entfernen. Was fehlt mir hier?

Answer 1

Sie eine beginnt mit Wahl verwenden können, zu tun, keine Notwendigkeit, die Schleife

$('div[id^="myPanel"]').each(function() { 
 

 
    $(this).css({ 
 
     height: Math.floor(Math.random()*200) + "px", 
 
     width: Math.floor(Math.random()*200) + "px" 
 
    }); 
 
    }) 
 

 
window.setTimeout(function() { 
 
    $('div[id^="myPanel"]').css({ 
 
    height: '', 
 
    maxWidth: '', 
 
    width: '' 
 
    });} 
 
, 1000);

div { 
 
    background-color: green; 
 
    margin: 1em; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div id="myPanel1" style="width:20px; height: 20px;">A</div> 
 
<div id="myPanel2" style="width:20px; height: 20px;">B</div> 
 
<div id="myPanel3" style="width:20px; height: 20px;">C</div> 
 
<div id="myPanel4" style="width:20px; height: 20px;">D</div>