Insert HTML, jQuery DOM and Javascript DOM - Javascript jQuery Method and Property

Javascript examples for jQuery Method and Property:before

  1. HOME
  2. Javascript
  3. jQuery Method and Property
  4. before

Description

Insert HTML, jQuery DOM and Javascript DOM

Demo Code

ResultView the demo in separate window 

<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script>
function beforeText() {/*from   ww  w .  j a  v  a  2s  .  com*/
    var txt1 = "<b>plain html</b>";                    // Create element with HTML
    var txt2 = $("<i></i>").text("created in jQuery");     // Create with jQuery
    var txt3 = document.createElement("u");    // Create with DOM
    txt3.innerHTML = "Javascript DOM";
    $("img").before(txt1, txt2, txt3);    // Insert new elements before img
}
</script>
</head>
<body>

<img src="http://java2s.com/resources/a.png" alt="jQuery" width="100" height="140">

<button onclick="beforeText()">Insert before</button>

</body>
</html>

Related Tutorials