Present the outcome in the specified location

Question

Present the outcome in the specified location

I need to quickly test my code and display the result in a specific area.

There's a button that should trigger something to be displayed when clicked. Right now I'm just using an alert for testing purposes.

    $(document).ready(function () {
        $('#btn1').click(myFunction);
    });
    function myFunction() {
        $('#res1').alert('hi');
    }

Here's my CSS:

#btn1 {
position: relative;
width: 50px;
height: 25px;
margin-left: 90px;
margin-top: 10px;
background-color: #008080;
}

#res1 {
position: relative;
width: 550px;
height: 550px;
}

My HTML is straightforward:

<div id="btn1">Send</div>
<div id="res1"></div>

jquery css

Answer 1

Answer №1

Are you looking to insert text into the res1 section? Follow these steps:

function insertText() {
    $('#res1').text('hello');
}

You can also include HTML content.

function insertHTML() {
    $('#res1').html('hello');
}

Answer 2

Are you looking to insert text into the res1 section? Follow these steps:

function insertText() {
    $('#res1').text('hello');
}

You can also include HTML content.

function insertHTML() {
    $('#res1').html('hello');
}

Answer 3

Answer №2

Why not give this a try?

$("#res1").text("hello there!")

This simple command will insert the text "hello there!" into the element with the id of #res1.

Answer 4

Why not give this a try?

$("#res1").text("hello there!")

This simple command will insert the text "hello there!" into the element with the id of #res1.

Present the outcome in the specified location

Answer №1

Answer №2

Similar questions

Ways to make React detect a click event triggered by Jquery

Choosing a specific element within another element of the same type using JQuery

Why won't my sticky element function properly with the position attribute set to sticky?

Help me understand what I'm missing with this cross-origin request

Access information via ajax from a php script

Creating dropdown menus dynamically and populating them based on the selection made in one dropdown menu to determine the options available

Puzzled by the CSS Box Model - There's a piece of the puzzle I

When FullCalendar eventRender is called, it can cause the browser tab to become

Avoiding memory leaks and performance hiccups in canvas applications

Position elements to the right side of a flex container

Challenges with Internal Styling on Wordpress Sites

Prevent clicks from passing through the transparent header-div onto bootstrap buttons

When my viewport's size is less than 998px, a blank space appears

The "html" element fails to achieve a full height when applying a 100% height setting

Why can't I capture the text within this particular div using .text?

Unable to append HTML table row to designated table

Troubleshooting Cascading Style Sheet problem on Samsung Galaxy S5

Guide on setting the path name to display a list of all files with the '.xml' extension using JQuery

Creating a jQuery multiple image preview feature is a simple and effective way to

Differentiate among comparable values through placement regex