title: Cannot use innerHTML in React Native
body: <p>I want to create an element(li) with and write a string with innerHTML in it and then append it to another element(ul) at last. I have seen that you need to use dangerouslysetinnerhtml function but I don't know how to use it.</p>
  <p><strong>THE ERROR:</strong></p>
  <blockquote>
  <p>TypeError: Cannot add property innerHTML, object is not extensible</p>
  </blockquote>
  <p><strong>MY CODE:</strong></p>
  <pre><code>import { StatusBar } from 'expo-status-bar';
  import React from 'react';
  import firebase from 'firebase'
  import { ActivityIndicatorComponent, StyleSheet, Text, View, TextInput, Button } from 'react-native';
  
  export default class Chatroom extends React.Component {
  
    constructor(props) {
      super(props)
      this.state = {
        UEmail: '',
        DefaultText: 'No contact has been selected.',
        messagebox: '',
      }
  }
  
    visiblechat = () =&gt; {
      this.setState({DefaultText: &quot;Contact has been selected.&quot;})
    }
   
  
    startchat = () =&gt; {
      var messageul = document.getElementById(&quot;messageboxul&quot;);
      var messagebox = this.state.messagebox;
      var txt = React.createElement(&quot;li&quot;);
      txt.innerHTML = messagebox
      messageul.appendChild(txt)
    }
  
    chatfunc = () =&gt; {
     var email = this.state.UEmail
     var emailurl = window.location.href;
     var useremailid = emailurl.substring(emailurl.indexOf(&quot;?&quot;) + 1);
     firebase.auth().fetchSignInMethodsForEmail(email)
     .then(providers =&gt; {
    if (providers.length === 0) {
      alert(&quot;This email ID doesn't exist. Enter a different Email address&quot;)
    }else if(email === useremailid){
     alert(&quot;You can't message yourself. Enter a different Email address&quot;)
    }else {
      this.visiblechat()
    }
  });
    }
  
    sendMessage = () =&gt; {
      var emailurl = window.location.href;
      var useremailid = emailurl.substring(emailurl.indexOf(&quot;?&quot;) + 1); //User display name
      var message;  //User message
      firebase.database().ref(&quot;messages&quot;).push().set({ //Save user name and message in reference &quot;messages&quot; in firebase database
          &quot;sender&quot;: useremailid,
          &quot;message&quot;: message
      });
      return false;
  }
  
    render() {
  
      var emailurl = window.location.href;
      var useremailid = emailurl.substring(emailurl.indexOf(&quot;?&quot;) + 1);
  
      var chatcontainer = {
        position: &quot;relative&quot;,
        top: 130,
        left: 8, 
      }
    return (&lt;&gt;
    &lt;Text&gt;Your Email: {useremailid}&lt;/Text&gt;
    &lt;Text style={{fontWeight: &quot;bold&quot;,fontSize: 20, position: &quot;relative&quot;, top: 20}}&gt;ENTER THE EMAIL OF WHO YOU WANT TO TALK TO:&lt;/Text&gt;
    &lt;View style={{position: &quot;absolute&quot;, top: 115, width: &quot;100%&quot;}}&gt;
    &lt;TextInput
            style={{height: 45,width: &quot;100%&quot;,borderColor: &quot;gray&quot;,borderWidth: 2}}
            placeholder=&quot; Enter Email...&quot;
            onChangeText={UEmail =&gt; this.setState({UEmail})}
            underlineColorAndroid=&quot;transparent&quot;
          /&gt;
          &lt;Button
            onPress={this.chatfunc}
            title=&quot;Login&quot;
            color=&quot;#00B0FF&quot;
          /&gt;
          &lt;/View&gt;
  
          &lt;View style={chatcontainer}&gt;
          &lt;Text style={{fontWeight:&quot;bold&quot;, position:&quot;relative&quot;,top:1}}&gt;{this.state.DefaultText}&lt;/Text&gt;
          &lt;View style={{position: &quot;relative&quot;, top:12}}&gt;
          &lt;ul id=&quot;messageboxul&quot;&gt;
           &lt;li&gt;hahah&lt;/li&gt;
          &lt;/ul&gt;
          &lt;div style={{position: &quot;sticky&quot;, top: 240,height: 60, width: &quot;100%&quot;}}&gt;
          &lt;TextInput style={{position: &quot;relative&quot;, width: &quot;100%&quot;, height: &quot;100%&quot;}} placeholder=&quot;Enter your message&quot;
          onChangeText={messagebox =&gt; this.setState({messagebox})}
          /&gt;
          &lt;button style={{position: &quot;relative&quot;, width: 243}} onClick={this.startchat}&gt;Send Message&lt;/button&gt;
          &lt;/div&gt;
          &lt;/View&gt;
          &lt;/View&gt;
  &lt;/&gt;);
    }
  }
  
  const styles = StyleSheet.create({
  
  });
  </code></pre>
  <p>Don't worry about the <code>sendmessage</code> function and<code>useremailid</code> variable, It is not important. I will be very grateful for your help.</p>