0

I am using Modern Script Editor on my SharePoint Online page and I want to put some HTML text on it (which is now a JSON object in the console).

But I want to start with a hardcoded string.

This is what I have now:

$(document).ready(function() {
    var divg = document.createElement("div");
    divg.appendChild(document.createTextNode("New DIV"));
    document.body.appendChild(divg);
});

However, nothing is being printed on the page.
What am I doing wrong?
Thanks in advance.

  • How did you embed the code? Have you used a Script Editor Web Part / Content Editor Web Part for? – SteffPoint Sep 30 at 14:23
  • I am using the Modern Script Editor web part – user3660293 Sep 30 at 18:17
0

Try Using below code:

<div id="testDiv"> &nbsp; </div>

<script type="text/javascript">    
    $(document).ready(function() {
        var str = '<p>Just some <span>text</span> here</p>';
        $('#testDiv').append(str);
    });
</script>

As you are already using $(document).ready(), I believe you have loaded jQuery file in your SharePoint page. If not then you can add it like below for testing your above code:

<script type="text/javascript" src="https://code.jquery.com/jquery-2.2.4.min.js"></script>
  • still receiving the error exptected expression, got '<', (pointing at the start of '<div id=' ) – user3660293 Sep 30 at 12:43
  • Try using updated code. It is working for me. If it is not working for you then there is some issue with your Modern Script Editor. – Ganesh Sanap Sep 30 at 12:53
  • can you take a look at my updated question? – user3660293 Sep 30 at 13:32
  • Is the code from my answer is working? Is the code from your updated answer is also throwing an error? – Ganesh Sanap Sep 30 at 13:34
  • no the code that you gave threw the same error. (exptected expression, got '<') while pointing to the html tag <div id="testDiv"> – user3660293 Sep 30 at 13:40
0

Try to use the code below to check if it works. Edit the modern page and add the code into modern script editor web part and click "Republish", and "Ctrl+F5" to refresh the page.

<script src="https://code.jquery.com/jquery-1.12.4.min.js" type="text/javascript"></script>
<script type="text/javascript">
var jq = $.noConflict();
jq(document).ready(function() {
    jq("#mytest").append("<span>Test</span>");
});
</script>
<div id="mytest"/>

enter image description here

If still not works, I suggest you re-install the modern script editor web part from here:

react-script-editor

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.