Question

Im using javascript to change the display of a object, there is a css class already for the same object : #id{display:none;} When i use javascript to alter display to display:block, the Display:block; appears on the object itself in the HTML. The css propertys seem to be overriding the html’s propertys because it still doesnt display.

prev4.onclick = function(){
lrg.setAttribute(“src”, eventpic4);
lefta.setAttribute(“display”, “block”);
};

Answer 1

A good practice is to avoid manipulating styles directly in JavaScript; you can rely on classes instead and let CSS handle the styling:

<style>
  #id { display: none; }
  #id.enabled { display: block; }
</style>
<script>
  document.getElementById("id").className = "enabled";
</script>