JavaScript

this.model.SubCategoryId = this.productForm.controls["subCategoryId"].value;
this.model.SubCategory = this.subCategories.find(sc => sc.Value === this.model.SubCategoryId).Key;

this.model.SubCategory = this.ensure(this.subCategories.find(sc => sc.Value === this.model.SubCategoryId)).Key;

ensure<T>(argument: T | undefined | null, message: string = "This value was promised to be there."): T {
  if (argument === undefined || argument === null) {
    throw new TypeError(message);
  }
  return argument;
}

<style>

.blueback {
  background-color="lightblue";
  
}
.yellowback {
  background-color="yellow";
  
}

</style>

<h1>
  Change CSS Classes
  
</h1>
<div id="d1">Hello</div>
</br>
<div id="d2">GoodBye</div>
</br>
<p>
<input type="button" value="Change Color!" onclick="colorchange()">
</p>


<script>

function colorchange() {
  
  var dd1=document.getElementById(d1);
  var dd2=document.getElementById(d2);
  
  dd1.className ="blueback";
  dd2.className ="yellowback";
  
  
 
</script>

<div class="header-top-outer container-fluid">

import style from '../css/styles.css'

<div className={style.footer-outer + ' ' + style.container-fluid}>

./src/components/FooterMenu.jsx
  Line 25:  'outer' is not defined  no-undef
  Line 25:  'fluid' is not defined  no-undef
  Line 26:  'outer' is not defined  no-undef

Search for the keywords to learn more about each error.

<div className={'${style.footer-outer} ${style.container-fluid}'} >