textContentがnullになる

javascript初心者です。
調べ方が悪いのか、、詰まってしまいました。
どなたかご教授お願いします。

【実装したいこと】
inputで設定したファイルとテキストをPostボタン押下時に表示
Postするたびに要素（div.span）を追加

【課題】
動的に追加した要素にtextContentを設定したいのですが、nullになります。
(Uncaught TypeError: Cannot set property 'textContent' of null)
htmlに要素を直書きすると表示されるのですが、うまく要素を追加できていないと考えています。

html
1<div class="mainContent">
2		<!-- 投稿入力エリア -->
3    <p class="postHead">投稿する</p>
4    <input type="file" id="postUrl">
5    <input type="text" id="postText" placeholder="テキスト">
6		<div id="postButton">Post</div>
7		<!-- 投稿表示エリア -->
8		<div id="postArea"></div>
9		<!-- <div id="outputMessage"></div>
10    <span id="previewArea"></span> -->
11  </div>
12<script src="js/jquery-3.4.1.min.js"></script>
13<script src="js/post.js"></script>

js
1'use strict';
2{
3  const postUrl = document.getElementById('postUrl');
4  const postText = document.getElementById('postText');
5  const postButton = document.getElementById('postButton');
6  var fileReader = new FileReader();
7  var strFileInfo;
8
9  // ファイル選択時のイベントハンドラ
10  $('#postUrl').on('change', function(){
11    strFileInfo = $('#postUrl')[0].files[0]; //ファイルをセット
12    //imageの場合
13    if(strFileInfo && strFileInfo.type.match('image.*')){
14      //既にファイルが存在する場合、削除
15      $('#preview').remove();
16      //プレビューエリアにセット
17      $('#previewArea').append('<img id="preview"/>');
18      //HTML5 のAPI である FileReader() メソッドを初期化
19      fileReader.onload = function(event){
20        $('#preview').attr('src', event.target.result);
21      }
22    }
23  });
24
25  //Postボタン押下時処理
26  postButton.onclick = function() {
27    //divを生成
28    const div = document.createElement('div'); //divを生成
29    div.classList.add('message'); //クラスを付与
30    document.getElementById('postArea').appendChild(div);
31    var message = document.getElementsByClassName("message"); //生成したdivを取得
32    var outputMessage = "outputMessage"; //付与するID
33    message.id = "outputMessage";
34
35    //spanを生成
36    const span = document.createElement('span');
37    span.classList.add('preview');
38    document.getElementById('postArea').appendChild(span);
39    var preview = document.getElementsByClassName("preview");
40    var previewArea = "previewArea";
41    preview.id = "previewArea";
42
43    // 値を取得
44    var inputMessage = document.getElementById("postText").value;
45    var outputMessage = document.getElementById("outputMessage");
46    outputMessage.textContent = inputMessage;
47    //セットした画像をローカルフォルダから読み込む
48    fileReader.readAsDataURL(strFileInfo);
49  }
50}
51