Dylan Longlett
Dylan Longlett

Reputation: 1

Javascript Function to Click Element that is Defined with Multiple Classes

I am trying to click a button but the only thing that defines it is multiple classes. The element I want to click is

<div class="U26fgb XHsn7e obPDgb M9Bg4d">This is a button </div>

How would I go about clicking it using Javascript?

Upvotes: 0

Views: 194

Answers (4)

Guy Louzon
Guy Louzon

Reputation: 1203

very simple with jQuery:

$(".U26fgb.XHsn7e.obPDgb.M9Bg4d").click(function(){
  console.log("clicked!");
}); 

Upvotes: 0

Ritika Gupta
Ritika Gupta

Reputation: 376

onclick attribute works well inside almost all the html tags and here is the simple solution to click on the div and get a result. All the Best!

function clickDiv(){
console.log("Div is Clicked");
}
<div class="U26fgb XHsn7e obPDgb M9Bg4d" onclick="clickDiv()">This is a button </div>

Upvotes: -1

Mehdi Aoussiad
Mehdi Aoussiad

Reputation: 9

const div = document.querySelector('div .M9Bg4d');
div.addEventListener("click", ()=> {
 // here put what you wanna do after clicking the div.

});

Upvotes: -1

Scott Marcus
Scott Marcus

Reputation: 65808

As long as it is the only <div> element with that class combination, you'd use .querySelector(), which accepts any valid CSS selector as an argument so you can select elements in JavaScript the same way you would in CSS:

// Scan the document for the <div> that has the required classes
let theDiv = document.querySelector("div.U26fgb.XHsn7e.obPDgb.M9Bg4d");

// Set up a click event handling function
theDiv.addEventListener("click", function(){
  console.log("you clicked me");
});


// Trigger the click event of the <div>
theDiv.click();
<div class="U26fgb XHsn7e obPDgb M9Bg4d">Click Me</div>

FYI: You should get out of the habit of putting spaces on the insides of the < and > delimiters in HTML. Use this:

<div class="U26fgb XHsn7e obPDgb M9Bg4d">Click Me</div>

Not this:

< div class="U26fgb XHsn7e obPDgb M9Bg4d" >Click Me< /div >

Upvotes: 3

Related Questions